/* =========================================================================
   Portfólio de Aprendizagem — Pesquisa Social (PPGE/UFPB)
   Design: acadêmico-editorial moderno. Serifada (Literata) para leitura
   longa + sans (Manrope) para UI. Paleta em tons de tinta/pergaminho com
   acento em verde-azulado (pesquisa) e terracota (destaque/citações).
   ========================================================================= */

:root{
  --bg: #faf7f1;
  --bg-elevated: #ffffff;
  --bg-alt: #f2ece1;
  --ink: #1f2420;
  --ink-soft: #4b5250;
  --ink-faint: #767d78;
  --line: #e2dbca;
  --line-strong: #cfc6ac;

  --accent: #1f6f66;
  --accent-ink: #0d4a43;
  --accent-soft: #e4efec;
  --accent-2: #b5542b;
  --accent-2-soft: #f7e7de;
  --gold: #b98a2b;

  --shadow-sm: 0 1px 2px rgba(31,36,32,.06), 0 1px 1px rgba(31,36,32,.04);
  --shadow-md: 0 8px 24px -8px rgba(31,36,32,.18);
  --shadow-lg: 0 24px 48px -16px rgba(31,36,32,.28);

  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;

  --font-serif: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-sans: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  color-scheme: light;
}

/* Modo escuro removido intencionalmente: o portfólio funciona apenas em modo claro. */

*, *::before, *::after{ box-sizing: border-box; }
[hidden]{ display: none !important; }
html{ scroll-behavior: smooth; }
body{
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width: 100%; display:block; }
h1,h2,h3,h4{ font-family: var(--font-serif); font-weight: 700; line-height: 1.2; margin: 0; color: var(--ink); }
p{ margin: 0 0 1em; }
a{ color: inherit; text-decoration: none; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family: inherit; cursor: pointer; }

.skip-link{
  position:absolute; left:-999px; top:0; background:var(--accent); color:#fff;
  padding:.6em 1em; z-index:999; border-radius: 0 0 8px 0;
}
.skip-link:focus{ left:0; }

/* ---------- progress bar ---------- */
.progress-bar{
  position: fixed; top:0; left:0; height:3px; width:0%;
  background: linear-gradient(90deg, var(--accent), var(--gold));
  z-index: 1000; transition: width .1s ease-out;
}

/* ---------- header ---------- */
.site-header{
  position: sticky; top:0; z-index: 500;
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter: blur(10px) saturate(1.2);
  border-bottom: 1px solid var(--line);
  transition: background .3s;
}
.header-inner{
  max-width: 1200px; margin:0 auto; padding: 0.7rem 1.5rem;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.brand{ display:flex; align-items:center; gap:.7rem; }
.brand-mark{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius: 10px;
  background: linear-gradient(145deg, var(--accent), var(--accent-ink));
  color:#fff; font-family: var(--font-serif); font-weight:700; font-size:.9rem;
  letter-spacing:.02em; flex-shrink:0;
}
.brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.brand-text strong{ font-family: var(--font-serif); font-size: 1rem; }
.brand-text small{ color: var(--ink-faint); font-size:.72rem; letter-spacing:.02em; }

.main-nav{ display:flex; gap: 1.7rem; }
.main-nav a{
  font-size:.92rem; font-weight:600; color: var(--ink-soft);
  padding: .3rem 0; position:relative; white-space:nowrap;
}
.main-nav a::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px;
  background: var(--accent); transform: scaleX(0); transition: transform .25s ease;
}
.main-nav a:hover{ color: var(--ink); }
.main-nav a.active{ color: var(--accent-ink); }
.main-nav a.active::after{ transform: scaleX(1); }

.header-actions{ display:flex; align-items:center; gap:.4rem; }
.icon-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%; border:1px solid var(--line);
  background: var(--bg-elevated); color: var(--ink-soft);
}
.icon-btn:hover{ color: var(--accent-ink); border-color: var(--accent); }
.nav-toggle{ display:none; }

/* ---------- hero ---------- */
.hero{
  position:relative; overflow:hidden;
  padding: clamp(4rem, 10vw, 7rem) 1.5rem clamp(3.5rem, 8vw, 5rem);
  text-align:center;
}
.hero-bg{ position:absolute; inset:0; z-index:0; }
.hero-shape{ position:absolute; border-radius:50%; filter: blur(60px); opacity:.35; }
.shape-1{ width:420px; height:420px; background: var(--accent); top:-140px; left:-120px; }
.shape-2{ width:360px; height:360px; background: var(--gold); bottom:-160px; right:-100px; opacity:.25;}
.hero-grid{
  position:absolute; inset:0;
  background-image: linear-gradient(color-mix(in srgb, var(--ink) 5%, transparent) 1px, transparent 1px),
                     linear-gradient(90deg, color-mix(in srgb, var(--ink) 5%, transparent) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(ellipse at center, black, transparent 75%);
}
.hero-inner{ position:relative; z-index:1; max-width: 780px; margin:0 auto; }
.hero-eyebrow{
  font-weight:700; letter-spacing:.06em; text-transform:uppercase; font-size:.78rem;
  color: var(--accent-ink); margin-bottom:.35rem;
}
.hero-program{ color: var(--ink-faint); font-size:.92rem; margin-bottom: 1.6rem; }
.hero-title{
  font-size: clamp(2.6rem, 6.5vw, 4.4rem); letter-spacing:-.01em; margin-bottom: 1.1rem;
}
.hero-title span{ color: var(--accent-ink); font-style: italic; }
.hero-discipline{ font-size: 1.05rem; color: var(--ink-soft); margin-bottom: 2.2rem; }
.hero-discipline strong{ color: var(--ink); }

.hero-meta{
  display:flex; flex-wrap:wrap; gap: 1rem 2.5rem; justify-content:center;
  padding: 1.1rem 1.5rem; margin: 0 auto 2rem; max-width: 620px;
  background: var(--bg-elevated); border:1px solid var(--line); border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}
.hero-author{ display:flex; align-items:center; gap:.9rem; text-align:left; }
.hero-author-text{ display:flex; flex-direction:column; }
.hero-author-name{ font-family: var(--font-serif); font-weight:700; font-size:1.05rem; }
.hero-author-role{ color: var(--ink-faint); font-size:.82rem; }
.hero-place{ display:flex; flex-direction:column; text-align:left; justify-content:center; font-size:.88rem; color: var(--ink-soft); }

/* ---------- avatar (foto circular) ---------- */
.avatar{
  position:relative; flex-shrink:0; width:54px; height:54px; border-radius:50%;
  overflow:hidden; background: linear-gradient(145deg, var(--accent), var(--accent-ink));
  display:flex; align-items:center; justify-content:center; border: 2px solid var(--bg-elevated);
  box-shadow: 0 0 0 1px var(--line);
}
.avatar img{ width:100%; height:100%; object-fit:cover; }
.avatar-initials{ display:none; color:#fff; font-weight:700; font-size:1rem; letter-spacing:.02em; }
.avatar.avatar-fallback .avatar-initials{ display:block; }
.avatar-md{ width:54px; height:54px; }
.avatar-lg{ width:88px; height:88px; }
.avatar-lg .avatar-initials{ font-size:1.5rem; }

.hero-actions{ display:flex; gap: .9rem; justify-content:center; flex-wrap:wrap; margin-bottom: 2.5rem; }
.btn{
  display:inline-flex; align-items:center; gap:.5rem; padding: .8rem 1.5rem;
  border-radius: 999px; font-weight:700; font-size:.92rem; transition: transform .2s, box-shadow .2s, background .2s;
  border: 1px solid transparent;
}
.btn-primary{ background: var(--accent); color:#fff; box-shadow: var(--shadow-sm); }
.btn-primary:hover{ transform: translateY(-2px); box-shadow: var(--shadow-md); }
.btn-ghost{ background: transparent; border-color: var(--line-strong); color: var(--ink); }
.btn-ghost:hover{ border-color: var(--accent); color: var(--accent-ink); }

.scroll-cue{
  background:none; border:none; color: var(--ink-faint);
  animation: bob 2.2s ease-in-out infinite;
}
.scroll-cue:hover{ color: var(--accent-ink); }
@keyframes bob{ 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(6px);} }

/* ---------- nota de transparência (uso de IA) ---------- */
.ai-note{ background: var(--accent-soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ai-note-inner{
  max-width: 1100px; margin: 0 auto; padding: .8rem 1.5rem; display:flex; align-items:flex-start; gap:.7rem;
}
.ai-note-icon{ flex-shrink:0; color: var(--accent-ink); margin-top: .15rem; }
.ai-note p{ margin:0; font-size:.82rem; line-height:1.55; color: var(--ink-soft); }
.ai-note strong{ color: var(--ink); }

/* ---------- quicknav chips ---------- */
.quicknav{
  border-bottom: 1px solid var(--line); background: var(--bg-alt);
  position: sticky; top: 62px; z-index: 100;
}
.quicknav-inner{
  max-width:1200px; margin:0 auto; padding:.6rem 1.5rem; display:flex; gap:.6rem;
  overflow-x:auto; scrollbar-width:none;
}
.quicknav-inner::-webkit-scrollbar{ display:none; }
.chip{
  flex-shrink:0; display:inline-flex; align-items:center; gap:.4rem;
  padding: .4rem .9rem; border-radius:999px; font-size:.82rem; font-weight:600;
  background: var(--bg-elevated); border:1px solid var(--line); color: var(--ink-soft);
  transition: all .2s;
}
.chip:hover{ border-color: var(--accent); color: var(--accent-ink); }
.chip-num{ color: var(--gold); font-family: var(--font-serif); font-weight:700; font-size:.78rem; }

/* ---------- generic sections ---------- */
.section{ padding: clamp(3.5rem, 7vw, 5.5rem) 1.5rem; }
.section-alt{ background: var(--bg-alt); }
.section-thesis{
  background: linear-gradient(180deg, var(--bg-alt), var(--bg));
}
.section-inner{ max-width: 1160px; margin: 0 auto; }
.section-kicker{
  font-weight:700; letter-spacing:.08em; text-transform:uppercase; font-size:.76rem;
  color: var(--accent-ink); margin-bottom:.5rem;
}
.section-title{ font-size: clamp(1.7rem, 3.4vw, 2.4rem); margin-bottom: 1rem; max-width: 46ch; }
.section-lead{ color: var(--ink-soft); font-size: 1.05rem; max-width: 68ch; margin-bottom: 2.6rem; }

/* ---------- timeline ---------- */
.timeline{ position:relative; padding-left: 2.6rem; }
.timeline-line{
  position:absolute; left: 10px; top: 8px; bottom: 8px; width:2px;
  background: linear-gradient(var(--line-strong), var(--line));
}
.tl-item{ position:relative; padding-bottom: 2.1rem; }
.tl-item:last-child{ padding-bottom:0; }
.tl-dot{
  position:absolute; left: -2.6rem; top: 6px; width:22px; height:22px; border-radius:50%;
  background: var(--bg-elevated); border: 3px solid var(--accent);
}
.tl-item-highlight .tl-dot{ background: var(--accent); box-shadow: 0 0 0 5px var(--accent-soft); }
.tl-card{
  background: var(--bg-elevated); border:1px solid var(--line); border-radius: var(--radius-md);
  padding: 1.3rem 1.5rem; box-shadow: var(--shadow-sm);
}
.tl-item-highlight .tl-card{ border-color: var(--accent); background: linear-gradient(180deg, var(--accent-soft), var(--bg-elevated)); }
.tl-period{ display:inline-block; font-size:.76rem; font-weight:700; letter-spacing:.04em; color: var(--accent-ink); margin-bottom:.35rem; text-transform:uppercase; }
.tl-card h3{ font-size: 1.12rem; margin-bottom:.4rem; }
.tl-card p{ color: var(--ink-soft); margin:0; font-size:.95rem; text-align: justify; text-justify: inter-word; hyphens: auto; }
.tl-caption{ display:block; margin-top:.4rem; font-size:.82rem; font-style: italic; color: var(--ink-faint); }

.tl-card-photo{ display:flex; gap:1.1rem; align-items:flex-start; }
.tl-thumb{
  flex-shrink:0; width:72px; height:72px; border-radius: var(--radius-sm); overflow:hidden;
  border:1px solid var(--line); box-shadow: var(--shadow-sm);
}
.tl-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.tl-card-body{ display:flex; flex-direction:column; min-width:0; flex:1; }
@media (max-width: 560px){
  .tl-card-photo{ flex-direction:column; }
  .tl-thumb{ width:100%; height:150px; }
}

/* ---------- prose grid / pull quote ---------- */
.prose-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap: 2.5rem; align-items:start; }
.prose-col p{ color: var(--ink-soft); }
.pull-quote{
  font-family: var(--font-serif); font-style: italic; font-size: 1.25rem; line-height:1.5;
  color: var(--ink); margin: 0 0 1.2rem; padding: 0 0 0 1.2rem; border-left: 3px solid var(--gold);
}

/* ---------- percurso de orientação ---------- */
.orientacao-grid{ display:grid; grid-template-columns: minmax(220px, 320px) 1fr; gap: 2.6rem; align-items:center; }
.orientacao-photo{ margin:0; }
.photo-frame{
  display:block; position:relative; width:100%; aspect-ratio: 4/5; border-radius: var(--radius-lg);
  overflow:hidden; background: linear-gradient(160deg, var(--accent-soft), var(--bg-alt));
  border: 1px solid var(--line); box-shadow: var(--shadow-md);
}
.photo-frame img{ width:100%; height:100%; object-fit:cover; }
.photo-pending-text{ display:none; }
.photo-frame.photo-pending{ display:flex; align-items:center; justify-content:center; }
.photo-frame.photo-pending .photo-pending-text{
  display:block; color: var(--ink-faint); font-size:.9rem; font-weight:600; text-align:center; padding: 1rem;
}
.orientacao-photo figcaption{ margin-top:.8rem; text-align:center; font-size:.85rem; color: var(--ink-faint); font-style: italic; }
.orientacao-text p{ color: var(--ink-soft); }
.orientacao-text p:first-child{ color: var(--ink); font-size:1.05rem; }

/* ---------- seminário apresentado / produções ---------- */
.seminario-list{ display:flex; flex-direction:column; gap:1rem; }
.seminario-card{
  display:flex; align-items:center; gap:1.2rem; flex-wrap:wrap;
  background: var(--bg-elevated); border:1px solid var(--line); border-radius: var(--radius-lg);
  padding: 1.6rem 1.8rem; box-shadow: var(--shadow-sm);
}
.seminario-icon{
  flex-shrink:0; width:56px; height:56px; border-radius: var(--radius-md);
  background: var(--accent-soft); color: var(--accent-ink); display:flex; align-items:center; justify-content:center;
}
.seminario-text{ display:flex; flex-direction:column; gap:.2rem; flex:1; min-width:200px; }
.seminario-text strong{ font-family: var(--font-serif); font-size:1.1rem; }
.seminario-status{ font-size:.85rem; color: var(--ink-faint); }
.seminario-btn{ padding: .7rem 1.4rem; }
.seminario-badge{
  padding:.5rem 1rem; border-radius:999px; background: var(--accent-2-soft); color: var(--accent-2);
  font-weight:700; font-size:.82rem; white-space:nowrap;
}

/* ---------- summary cards ---------- */
.summary-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap:1.4rem; }
.summary-card{
  background: var(--bg-elevated); border:1px solid var(--line); border-radius: var(--radius-md);
  padding: 1.6rem; box-shadow: var(--shadow-sm); transition: transform .2s, box-shadow .2s, border-color .2s;
}
.summary-card:hover{ transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--accent); }
.summary-icon{ font-size: 1.8rem; display:inline-block; margin-bottom:.8rem; }
.summary-card h3{ font-size: 1.1rem; margin-bottom:.5rem; }
.summary-card p{ color: var(--ink-soft); font-size:.92rem; margin:0; }

/* ---------- recursos visuais (accordion cards) ---------- */
.recursos-list{ display:flex; flex-direction:column; gap: 1.4rem; }
.recurso-card{
  background: var(--bg-elevated); border:1px solid var(--line); border-radius: var(--radius-lg);
  overflow:hidden; box-shadow: var(--shadow-sm);
}
.recurso-head{
  width:100%; display:flex; align-items:center; gap:1rem; padding: 1.3rem 1.6rem;
  background:none; border:none; text-align:left; color: var(--ink);
}
.recurso-badge{
  flex-shrink:0; font-size:.72rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase;
  padding:.3rem .7rem; border-radius:999px; background: var(--accent-soft); color: var(--accent-ink);
}
.recurso-head-text{ flex:1; min-width:0; }
.recurso-head-text h3{ font-size: 1.2rem; margin-bottom:.15rem; }
.recurso-head-text p{ margin:0; color: var(--ink-faint); font-size:.85rem; }
.recurso-chevron{ flex-shrink:0; transition: transform .3s; color: var(--ink-faint); }
.recurso-card.open .recurso-chevron{ transform: rotate(180deg); color: var(--accent-ink); }

.recurso-panel{
  max-height:0; overflow:hidden; transition: max-height .4s ease;
}
.recurso-card.open .recurso-panel{ max-height: 6000px; transition: max-height .6s ease; }
.recurso-panel-inner{ padding: 0 1.6rem 1.8rem; border-top:1px solid var(--line); }

.ficha-tecnica{ width:100%; border-collapse: collapse; margin: 1.2rem 0; font-size:.9rem; }
.ficha-tecnica tr{ border-bottom:1px solid var(--line); }
.ficha-tecnica tr:last-child{ border-bottom:none; }
.ficha-tecnica th, .ficha-tecnica td{ text-align:left; padding:.5rem .6rem; vertical-align:top; }
.ficha-tecnica th{ width: 220px; color: var(--ink-faint); font-weight:600; }

.block-title{ font-family: var(--font-serif); font-size:1.05rem; margin: 1.4rem 0 .6rem; color: var(--accent-ink); }
.recurso-panel-inner p{ color: var(--ink-soft); }

.tese-box{
  margin-top: 1.8rem; padding: 1.5rem 1.6rem; border-radius: var(--radius-md);
  background: linear-gradient(160deg, var(--accent-2-soft), transparent); border:1px solid color-mix(in srgb, var(--accent-2) 35%, var(--line));
}
.tese-box h4{ font-family: var(--font-serif); color: var(--accent-2); font-size:1.1rem; margin-bottom:.8rem; }
.tese-box p{ color: var(--ink-soft); }
.tese-box em{ color: var(--ink-faint); }

.ref-list{ margin-top:1rem; font-size:.85rem; color: var(--ink-faint); }
.ref-list li{ margin-bottom:.3rem; padding-left:1rem; text-indent:-1rem; }

/* ---------- fichamentos toolbar & grid ---------- */
.fich-toolbar{ display:flex; flex-direction:column; gap:1rem; margin-bottom: 1.2rem; }
.search-box{
  display:flex; align-items:center; gap:.6rem; background: var(--bg-elevated);
  border:1px solid var(--line); border-radius: 999px; padding: .7rem 1.1rem; max-width: 480px;
  color: var(--ink-faint);
}
.search-box input{
  border:none; outline:none; background:none; flex:1; font-size:.95rem; color: var(--ink); font-family: inherit;
}
.fich-tags{ display:flex; flex-wrap:wrap; gap:.5rem; }
.tag-btn{
  padding:.35rem .8rem; border-radius:999px; border:1px solid var(--line); background: var(--bg-elevated);
  font-size:.8rem; font-weight:600; color: var(--ink-soft); transition: all .2s;
}
.tag-btn:hover{ border-color: var(--accent); }
.tag-btn.active{ background: var(--accent); color:#fff; border-color: var(--accent); }
.fich-count{ color: var(--ink-faint); font-size:.85rem; margin-bottom:1.2rem; }
.fich-empty{ text-align:center; color: var(--ink-faint); padding: 3rem 0; }

.fich-grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(300px,1fr)); gap:1.2rem; }
.fich-card{
  text-align:left; background: var(--bg-elevated); border:1px solid var(--line); border-radius: var(--radius-md);
  padding: 1.4rem; box-shadow: var(--shadow-sm); display:flex; flex-direction:column; gap:.7rem;
  transition: transform .2s, box-shadow .2s, border-color .2s; position:relative;
}
.fich-card:hover{ transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--accent); }
.fich-card.destaque{ border-color: color-mix(in srgb, var(--gold) 50%, var(--line)); }
.fich-card.destaque::before{
  content:"★ Núcleo teórico"; position:absolute; top:-10px; right:14px; font-size:.66rem; font-weight:800;
  background: var(--gold); color:#241a05; padding:.2rem .55rem; border-radius:999px; letter-spacing:.03em;
}
.fich-card-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:.6rem; }
.fich-card-year{ font-size:.74rem; font-weight:700; color: var(--ink-faint); white-space:nowrap; }
.fich-card h3{ font-size: 1.08rem; line-height:1.3; }
.fich-card-author{ font-size:.85rem; color: var(--accent-ink); font-weight:600; }
.fich-card-area{ font-size:.85rem; color: var(--ink-soft); flex:1; }
.fich-card-tags{ display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.2rem; }
.mini-tag{ font-size:.7rem; padding:.2rem .55rem; border-radius:999px; background: var(--bg-alt); color: var(--ink-faint); }
.fich-card-cta{ margin-top:auto; font-size:.85rem; font-weight:700; color: var(--accent-ink); display:flex; align-items:center; gap:.35rem; }
.fich-card-cta svg{ transition: transform .2s; }
.fich-card:hover .fich-card-cta svg{ transform: translateX(3px); }

/* ---------- thesis flow ---------- */
.thesis-flow{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; margin-bottom: 1.8rem; }
.thesis-step{
  background: var(--bg-elevated); border:1px solid var(--line); border-radius: var(--radius-md);
  padding: 1.4rem; position:relative;
}
.thesis-step-num{
  display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:50%;
  background: var(--accent); color:#fff; font-weight:800; font-size:.85rem; margin-bottom:.8rem;
}
.thesis-step h3{ font-size:1rem; margin-bottom:.5rem; }
.thesis-step p{ font-size:.88rem; color: var(--ink-soft); margin:0; }
.thesis-caveat{ font-size:.85rem; color: var(--ink-faint); font-style: italic; max-width: 70ch; }

/* ---------- ensaio (SISV 2026) ---------- */
.ensaio-titulo{ max-width: 62ch; font-size: clamp(1.45rem, 2.8vw, 2rem); font-style: italic; }
.ensaio-card{
  max-width: 840px; background: var(--bg-elevated); border:1px solid var(--line); border-radius: var(--radius-lg);
  padding: 2rem 2.2rem; box-shadow: var(--shadow-sm);
}
.ensaio-resumo{
  color: var(--ink-soft); font-size: 1rem; line-height: 1.75; margin: 0 0 1.7rem;
  text-align: justify; text-justify: inter-word; hyphens: auto;
}
.ensaio-btn{ display:inline-flex; align-items:center; gap:.55rem; }

/* ---------- footer ---------- */
.site-footer{ background: var(--ink); color: color-mix(in srgb, var(--bg) 85%, white); padding: 2.6rem 1.5rem; position:relative; }
.footer-inner{ max-width:1160px; margin:0 auto; display:grid; grid-template-columns: repeat(3,1fr); gap:1.6rem; }
.footer-col{ display:flex; flex-direction:column; gap:.25rem; font-size:.85rem; opacity:.85; }
.footer-col strong{ font-family: var(--font-serif); font-size:1rem; opacity:1; }
.footer-note{ font-size:.78rem; opacity:.6; }
.to-top{
  position:absolute; right: 1.5rem; top:-22px; width:44px; height:44px; border-radius:50%;
  background: var(--accent); color:#fff; border:4px solid var(--bg); box-shadow: var(--shadow-md);
  display:flex; align-items:center; justify-content:center;
}

/* ---------- lightbox de fotos ---------- */
img.js-lightbox{ cursor: zoom-in; }
.lightbox-overlay{
  position: fixed; inset:0; background: rgba(8,10,8,.86);
  z-index: 950; display:flex; align-items:center; justify-content:center; padding: 4vh 4vw;
}
.lightbox-overlay[hidden]{ display:none; }
.lightbox-figure{
  margin:0; max-width: min(92vw, 900px); max-height: 92vh; display:flex; flex-direction:column; align-items:center; gap:.9rem;
  animation: lightboxIn .2s ease;
}
@keyframes lightboxIn{ from{ opacity:0; transform: scale(.97);} to{ opacity:1; transform:none; } }
.lightbox-figure img{
  max-width:100%; max-height: 82vh; width:auto; height:auto; object-fit:contain;
  border-radius: var(--radius-md); box-shadow: var(--shadow-lg); background: var(--bg-elevated);
}
.lightbox-figure figcaption{
  color: #f2f0ea; font-size:.9rem; text-align:center; font-style: italic; max-width: 60ch; opacity:.85;
}
.lightbox-figure figcaption:empty{ display:none; }
.lightbox-close{
  position: fixed; top: 1.5rem; right: 1.5rem; width:44px; height:44px; border-radius:50%;
  border:1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.08); color:#fff; z-index:2;
  display:flex; align-items:center; justify-content:center; backdrop-filter: blur(4px);
}
.lightbox-close:hover{ background: rgba(255,255,255,.18); }

/* ---------- modal ---------- */
.modal-overlay{
  position: fixed; inset:0; background: rgba(10,12,10,.55); backdrop-filter: blur(3px);
  z-index: 900; display:flex; align-items:flex-start; justify-content:center; padding: 4vh 1rem;
  overflow-y:auto;
}
.modal-overlay[hidden]{ display:none; }
.modal{
  background: var(--bg-elevated); width: min(760px, 100%); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg); position:relative; max-height: 92vh; display:flex; flex-direction:column;
  animation: modalIn .25s ease;
}
@keyframes modalIn{ from{ opacity:0; transform: translateY(12px) scale(.98);} to{ opacity:1; transform:none; } }
.modal-close{
  position:absolute; top: 1rem; right: 1rem; width:36px; height:36px; border-radius:50%;
  border:1px solid var(--line); background: var(--bg-alt); color: var(--ink-soft); z-index:2;
}
.modal-close:hover{ color: var(--ink); border-color: var(--accent); }
.modal-header{ padding: 1.8rem 3.2rem 1rem 1.8rem; border-bottom:1px solid var(--line); }
.modal-eyebrow{ font-size:.78rem; font-weight:700; color: var(--accent-ink); text-transform:uppercase; letter-spacing:.04em; margin-bottom:.3rem; }
.modal-header h2{ font-size: 1.5rem; margin-bottom:.4rem; }
.modal-ref{ font-size:.82rem; color: var(--ink-faint); font-style: italic; margin:0; }
.modal-tabs{ display:flex; gap:.3rem; padding: .8rem 1.8rem 0; overflow-x:auto; flex-shrink:0; }
.modal-tab{
  padding:.5rem .9rem; border-radius: 999px 999px 0 0; font-size:.82rem; font-weight:700;
  background:none; border:none; color: var(--ink-faint); white-space:nowrap; border-bottom: 2px solid transparent;
}
.modal-tab:hover{ color: var(--ink); }
.modal-tab.active{ color: var(--accent-ink); border-bottom-color: var(--accent); background: var(--accent-soft); border-radius: 8px 8px 0 0; }
.modal-body{ padding: 1.4rem 1.8rem 2rem; overflow-y:auto; }
.modal-body h4{ font-family: var(--font-serif); color: var(--accent-ink); font-size:1rem; margin: 1.1rem 0 .5rem; }
.modal-body h4:first-child{ margin-top:0; }
.modal-body p{ color: var(--ink-soft); font-size:.94rem; text-align: justify; text-justify: inter-word; hyphens: auto; }
.modal-body .note{
  font-size:.85rem; color: var(--ink-faint); font-style:italic; padding-left:.9rem; border-left:2px solid var(--line-strong);
  margin: .5rem 0 1rem; text-align: justify; text-justify: inter-word; hyphens: auto;
}
.quote-list{ display:flex; flex-direction:column; gap:.7rem; margin: .5rem 0 1rem; }
.quote-item{
  font-family: var(--font-serif); font-style:italic; font-size:.94rem; color: var(--ink);
  background: var(--bg-alt); border-left: 3px solid var(--gold); border-radius: 0 8px 8px 0;
  padding: .7rem .9rem; text-align: justify; text-justify: inter-word; hyphens: auto;
}
.subsection{ margin-bottom: 1.4rem; padding-bottom:1.2rem; border-bottom: 1px dashed var(--line); }
.subsection:last-child{ border-bottom:none; }
.subsection h5{ font-family: var(--font-serif); font-size:.98rem; color: var(--ink); margin-bottom:.4rem; }
.credit-note{
  margin-top: 1.4rem; font-size:.78rem; color: var(--ink-faint); text-align:right; font-style:italic;
}
.tag-row{ display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:1rem; }

/* ---------- responsive ---------- */
@media (max-width: 900px){
  .prose-grid{ grid-template-columns: 1fr; }
  .summary-grid{ grid-template-columns: 1fr; }
  .thesis-flow{ grid-template-columns: repeat(2,1fr); }
  .footer-inner{ grid-template-columns: 1fr; }
  .orientacao-grid{ grid-template-columns: 1fr; }
  .orientacao-photo{ max-width: 320px; margin: 0 auto; }
}

@media (max-width: 760px){
  .main-nav{
    position:fixed; top: 60px; left:0; right:0; background: var(--bg-elevated);
    border-bottom:1px solid var(--line); flex-direction:column; padding: .8rem 1.5rem 1.2rem;
    gap: .2rem; transform: translateY(-8px); opacity:0; pointer-events:none; transition: all .2s;
    box-shadow: var(--shadow-md);
  }
  .main-nav.open{ transform:none; opacity:1; pointer-events:auto; }
  .main-nav a{ padding: .6rem 0; border-bottom: 1px solid var(--line); }
  .main-nav a:last-child{ border-bottom:none; }
  .nav-toggle{ display:inline-flex; }
  .quicknav{ top: 60px; }
  .thesis-flow{ grid-template-columns: 1fr; }
  .ficha-tecnica th{ width: 130px; }
  .modal-header{ padding-right: 3rem; }
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior:auto !important; }
}
