/* ====== Fontes locais (TTF) ====== */
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-Regular.ttf") format("truetype");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-Bold.ttf") format("truetype");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Noto Serif";
  src: url("../fonts/NotoSerif-Regular.ttf") format("truetype");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Noto Serif";
  src: url("../fonts/NotoSerif-Bold.ttf") format("truetype");
  font-weight: 700; font-style: normal; font-display: swap;
}

/* ====== Reset mínimo + tokens ====== */
*,
*::before,
*::after { box-sizing: border-box; }

:root{
  --bg: #0e1320;           /* noite oceânica */
  --paper: #f2efe5;        /* pergaminho */
  --ink: #202127;
  --sea: #1a2a44;
  --gold: #d9b66f;
  --teal: #2c6b72;
  --accent: #8fb4c9;

  --header-h: 72px;
  --radius-xl: 16px;
  --shadow-md: 0 10px 30px rgba(0,0,0,.25);
  --shadow-sm: 0 6px 18px rgba(0,0,0,.18);

  --speed: .7s;
  --easing: cubic-bezier(.2,.7,.2,1);
}

html, body { height: 100%; }
body{
  margin: 0;
  background: radial-gradient(1200px 900px at 70% -10%, #142036 0%, #0e1320 55%, #0b1020 100%);
  color: var(--paper);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.6;
}

/* Acessibilidade */
.skip-link{
  position: absolute; left: -9999px; top: auto;
}
.skip-link:focus{
  left: 16px; top: 12px; z-index: 9999;
  background: var(--paper); color: var(--ink);
  padding: 8px 12px; border-radius: 8px;
}

/* Container padrão */
.container{
  width: min(1140px, 92vw);
  margin-inline: auto;
}

/* ====== Header fixo ====== */
.site-header{
  position: fixed; inset: 0 0 auto 0; height: var(--header-h);
  backdrop-filter: blur(6px);
  background: linear-gradient(180deg, rgba(10,16,30,.75), rgba(10,16,30,.45));
  border-bottom: 1px solid rgba(217,182,111,.2);
  z-index: 1000;
}
.header-inner{
  display: flex; align-items: center; justify-content: space-between;
  height: 100%;
}
.brand{
  display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: #fff;
}
.logo-mark{
  width: 28px; height: 28px; border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, var(--gold), #986f2d 60%, #5e3e13);
  box-shadow: inset 0 0 8px rgba(0,0,0,.35), 0 0 12px rgba(217,182,111,.35);
}
.logo-text{ font-weight: 600; letter-spacing: .2px; }
.logo-text b{ color: var(--gold); font-weight: 700; }

.site-nav ul{
  display: flex; gap: 18px; list-style: none; margin: 0; padding: 0;
}
.site-nav a{
  color: #e9e6dc; text-decoration: none; padding: 8px 10px; border-radius: 8px;
  transition: transform .2s var(--easing), background .2s;
}
.site-nav a:hover{ background: rgba(217,182,111,.12); transform: translateY(-1px); }

/* Toggle mobile */
.nav-toggle{
  display: none; border: 0; background: transparent; cursor: pointer;
  width: 40px; height: 40px; border-radius: 10px;
}
.nav-toggle .bar{
  display: block; height: 2px; margin: 7px 6px; background: #fff; border-radius: 2px;
  transition: transform .25s, opacity .25s;
}
.nav-open .nav-toggle[aria-expanded="true"] .bar:nth-child(1){ transform: translateY(9px) rotate(45deg); }
.nav-open .nav-toggle[aria-expanded="true"] .bar:nth-child(2){ opacity: 0; }
.nav-open .nav-toggle[aria-expanded="true"] .bar:nth-child(3){ transform: translateY(-9px) rotate(-45deg); }

/* ====== Main ====== */
.site-main{ padding-top: calc(var(--header-h) + 18px); }
.page-title{
  font-family: "Noto Serif", serif;
  font-weight: 700;
  letter-spacing: .3px;
  font-size: clamp(1.4rem, 1rem + 2vw, 2.2rem);
  padding: 32px 0 10px;
  margin: 0 auto 6px;
  width: min(1000px, 90vw);
}

/* ====== Footer ====== */
.site-footer{
  border-top: 1px solid rgba(217,182,111,.2);
  background: linear-gradient(180deg, rgba(14,19,32,.4), rgba(14,19,32,.75));
  margin-top: 48px;
}
.footer-inner{
  display: grid; gap: 12px;
  grid-template-columns: 1fr auto auto;
  align-items: center; padding: 18px 0;
}
.brandline{ margin: 0; color: #ddd7c7; }
.foot-links{ display: flex; gap: 16px; list-style: none; margin: 0; padding: 0; }
.foot-links a{ color: #e9e6dc; text-decoration: none; }
.foot-links a:hover{ color: var(--gold); }
.back-to-top{
  justify-self: end; text-decoration: none; color: var(--gold);
  border: 1px solid rgba(217,182,111,.45); padding: 6px 10px; border-radius: 10px;
}
.back-to-top:hover{ background: rgba(217,182,111,.12); }

/* ====== Revelação ao rolar ====== */
[data-reveal]{ opacity: 0; transform: translateY(14px) scale(.98); will-change: transform, opacity; }
.in-view{ opacity: 1; transform: none; transition: opacity var(--speed) var(--easing), transform var(--speed) var(--easing); }

/* ====== Imagens globais: max 350px ====== */
img{ display: block; width: 100%; height: auto; max-width: 350px; border-radius: 12px; }

/* ====== Media queries ====== */
@media (max-width: 1024px){
  .site-nav ul{ gap: 14px; }
}
@media (max-width: 860px){
  .nav-toggle{ display: inline-block; }
  .site-nav{
    position: absolute; right: 0; top: var(--header-h);
    background: rgba(10,16,30,.98);
    border-left: 1px solid rgba(217,182,111,.2);
    width: min(320px, 80vw);
    transform: translateX(100%); transition: transform .3s var(--easing);
    box-shadow: var(--shadow-md);
  }
  .site-nav ul{ flex-direction: column; padding: 14px; }
  .nav-open #site-nav{ transform: translateX(0%); }
}
@media (max-width: 640px){
  .footer-inner{ grid-template-columns: 1fr; gap: 8px; }
  .back-to-top{ justify-self: start; }
}
@media (max-width: 360px){
  :root{ --header-h: 66px; }
  .page-title{ width: 92vw; }
}