/* =========================================================
   QUEM SOMOS – estilo completo (padrão da index, sem cantos
   arredondados e com comentários explicativos)
========================================================= */

:root{
  --azul-900:#17232b;
  --azul-800:#1d2e3a;
  --azul-700:#213645;
  --azul-600:#2b4658;
  --azul-100:#eef5fb;

  --texto:#20303b;
  --branco:#ffffff;
  --dourado:#e7d9a8;
  --dourado-escuro:#cabd8a;

  --shadow: 0 10px 30px rgba(0,0,0,.15);
  --container: 1180px;
}

*{ box-sizing: border-box; }
html,body{ height:100%; scroll-behavior:smooth; }
body{
  margin:0;
  color:var(--texto);
  font: 400 16px/1.6 "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:#fafcfe;
}

/* Utilitário de acessibilidade */
.sr-only{
  position:absolute; width:1px; height:1px; margin:-1px; border:0; padding:0;
  white-space:nowrap; clip-path:inset(50%); clip:rect(0 0 0 0); overflow:hidden;
}

/* Contêiner centralizado */
.container{ width:min(var(--container), 90%); margin-inline:auto; }

/* ===========================
   HEADER (mesmo da index)
=========================== */
.site-header{
  position:fixed; inset-block-start:0; inset-inline:0; z-index:1000;
  transition: background .25s ease, box-shadow .25s ease;
  background:transparent;
}
.site-header.scrolled{ background:rgba(23,35,43,.9); box-shadow:var(--shadow); backdrop-filter: blur(6px); }

.header-wrap{ display:flex; align-items:center; justify-content:space-between; padding:16px 0; }

.logo{ display:inline-flex; align-items:center; text-decoration:none; }
.logo svg text{ paint-order: stroke; stroke:#1b2530; stroke-width:.8; }

/* Navegação desktop */
.nav ul{ list-style:none; display:flex; gap:28px; margin:0; padding:0; }
.nav a{ text-decoration:none; color:#d9e6f2; font-weight:500; letter-spacing:.2px; }
.nav a:hover, .nav a:focus, .nav a[aria-current="page"]{ color:var(--dourado); }

/* Botão hambúrguer */
.menu-toggle{ display:none; background:transparent; border:0; color:#d9e6f2; cursor:pointer; }

/* ===========================
   HERO
=========================== */
.hero{ position:relative; min-height:60vh; display:grid; align-items:center; }
.hero-bg{
  position:absolute; inset:0;
  background:center/cover no-repeat url("../img/mesa.webp");
  filter: blur(1px);
  z-index:-2;
}
.hero-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(23,35,43,.55) 0%, rgba(23,35,43,.75) 70%); z-index:-1; }
.hero-content{ text-align:center; color:#eaf2fb; padding:120px 0 40px; }
.hero-title{
  margin:0; font-family:"Playfair Display",serif; font-weight:700;
  font-size: clamp(28px, 5vw, 46px); letter-spacing:2px;
}

/* ===========================
   PAINEL DESTAQUE
=========================== */
.highlight{
  margin-top:-26px; /* aproxima da faixa do banner como no mockup */
  background:#233746; color:#dfe9f2; box-shadow:var(--shadow);
  padding:36px 26px; text-align:center;
}
.highlight-title{
  margin:0; font:700 clamp(22px,3.2vw,32px) "Playfair Display",serif; letter-spacing:1.5px;
}
.highlight-rule{
  width:min(760px, 90%); border:0; border-top:1px solid rgba(255,255,255,.25);
  margin:18px auto 16px;
}
.highlight-text{ margin:0 auto; max-width:820px; }

/* ===========================
   BLOCO FUNDADORA
=========================== */
.founder{
  display:grid; grid-template-columns: 1.05fr 1fr; gap:40px; align-items:start;
  padding:50px 0 20px;
}
.founder-media img{ width:100%; height:auto; display:block; object-fit:cover; }
.founder-text{ color:#233746; }
.founder-title{
  margin:0 0 10px; font:700 clamp(22px,3.8vw,40px) "Playfair Display",serif; color:#273d4d;
}
.founder-list{ list-style:none; padding:0; margin:18px 0; display:grid; gap:10px; }
.founder-list li{ display:flex; align-items:flex-start; gap:10px; }
.founder-list svg{ color:#c7b97f; margin-top:3px; }
.fights-title{ margin:18px 0 8px; font:700 26px "Playfair Display",serif; }

/* ===========================
   CONTATO (padrão da index)
=========================== */
.contato{ background:linear-gradient(180deg, var(--azul-800), var(--azul-900)); color:#dfe9f2; padding:70px 0; }
.contato-wrap{ display:grid; grid-template-columns: 1fr 1.1fr; gap:38px; background:rgba(0,0,0,.14); padding:34px; }
.contato-info{ display:grid; gap:20px; align-content:start; }
.info-item{ display:flex; align-items:center; gap:12px; font-size:18px; }
.info-item svg{ color:#dfe9f2; }
.contato-form{ display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
.form-row{ display:grid; gap:8px; }
.form-row--full{ grid-column:1 / -1; }
input, textarea{
  width:100%; border:1px solid #375165; background:#132029; color:#eaf2fb;
  padding:14px 14px; outline:0;
}
input::placeholder, textarea::placeholder{ color:#a9bfce; }
input:focus, textarea:focus{ border-color:#4a86b7; box-shadow:0 0 0 3px rgba(74,134,183,.25); }
.erro{ color:#ffd2d2; font-size:13px; min-height:16px; }
.btn{ display:inline-block; padding:12px 22px; background:#2f89c5; color:#fff; text-decoration:none; font-weight:600; box-shadow:0 12px 24px rgba(0,0,0,.18); }
.btn:hover{ filter:brightness(1.05); transform:translateY(-1px); }
.btn-send{ grid-column:1 / -1; justify-self:start; }
.form-feedback{ grid-column:1 / -1; margin-top:6px; min-height:20px; }

/* ===========================
   RODAPÉ + VOLTAR AO TOPO
=========================== */
.footer{ background:#0f171c; color:#a7bdcb; padding:18px 0; text-align:center; }

.top-btn{
  position:fixed; right:16px; bottom:16px; width:40px; height:40px;
  border:0; background:#1f2f3a; color:#eaf2fb; display:grid; place-items:center;
  box-shadow:var(--shadow); cursor:pointer; opacity:0; visibility:hidden; transition:.2s ease;
}
.top-btn.show{ opacity:1; visibility:visible; }

/* ===========================
   RESPONSIVIDADE
=========================== */
@media (max-width: 1024px){
  .founder{ grid-template-columns:1fr; }
}

/* === MENU MOBILE IGUAL AO DA HOME (index.css) === */
@media (max-width: 760px){
  /* Exibe o botão hambúrguer */
  .menu-toggle{ display:inline-flex; }

  /* FECHADO por padrão (totalmente invisível) */
  .nav{
    position: fixed;
    inset-inline: 0;
    inset-block-start: 64px;               /* altura aproximada do header */
    background: rgba(23,35,43,.98);
    backdrop-filter: blur(8px);

    /* Esconde TOTALMENTE (sem “risco” visível) */
    transform: translateY(-8px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition: transform .25s ease, opacity .2s ease, visibility .2s ease;
    max-height: calc(100vh - 64px);
    overflow-y: auto;
    box-shadow: none;                      /* sem sombra quando fechado */
    will-change: transform, opacity;
    z-index: 1000;
  }

  /* ABERTO */
  .nav.open{
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    box-shadow: var(--shadow);
  }

  .nav ul{ flex-direction:column; gap:0; }
  .nav li{ border-top:1px solid rgba(255,255,255,.06); }
  .nav a{ display:block; padding:14px 20px; }

  /* Contato responsivo */
  .contato-wrap{ grid-template-columns:1fr; }
  .contato-form{ grid-template-columns:1fr; }
  .btn-send{ justify-self:stretch; text-align:center; }
}

/* Centralização extra (igual à index) */
.contato-wrap{
  margin-inline:auto;          /* garante centralização */
  justify-content:center;      /* alinha grid ao centro se sobrar espaço */
}