/* Flor&IPA FC — estilo compartilhado pelas páginas do site */
@import url('https://fonts.googleapis.com/css2?family=Alfa+Slab+One&family=Barlow+Condensed:wght@600;700&family=Archivo:wght@400;500;600&display=swap');

:root{
  --escudo:#0E120C; --painel:#151C14; --folha:#2E5A2C; --lupulo:#94C256;
  --ouro:#D6A63C; --brilho:#EEB23A; --creme:#F2ECDD; --fumaca:#9AA898;
  --cond:'Barlow Condensed','Archivo Narrow',system-ui,sans-serif;
  --corpo:'Archivo',system-ui,-apple-system,sans-serif;
  --menu-h:52px;
}
*{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html{ scroll-behavior:smooth; }
body{
  margin:0; min-height:100%; color:var(--creme); background:var(--escudo);
  font-family:var(--corpo); overflow-x:hidden;
  padding-top:calc(var(--menu-h) + env(safe-area-inset-top));
}
img{ max-width:100%; }
a{ color:var(--brilho); }

/* fundo com os uniformes, bem apagado */
body::before{ content:""; position:fixed; inset:0; z-index:-2;
  background:url('/fundo.jpg') center/cover no-repeat; opacity:.18; }
body::after{ content:""; position:fixed; inset:0; z-index:-1;
  background:radial-gradient(105% 65% at 50% 10%, rgba(29,45,26,.5) 0%,
    rgba(14,18,12,.94) 58%, var(--escudo) 100%); }

/* ---------- menu fixo ---------- */
.menu{ position:fixed; top:0; left:0; right:0; z-index:50;
  height:calc(var(--menu-h) + env(safe-area-inset-top));
  padding:env(safe-area-inset-top) .7rem 0;
  display:flex; align-items:center; gap:.15rem;
  background:rgba(10,14,9,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(214,166,60,.4); overflow-x:auto;
  scrollbar-width:none; }
.menu::-webkit-scrollbar{ display:none; }
.menu .brasao{ flex:none; display:flex; align-items:center; margin-right:.5rem; }
.menu .brasao img{ height:32px; width:auto; display:block; }
.menu a{ flex:none; text-decoration:none; color:var(--fumaca);
  font-family:var(--cond); text-transform:uppercase; letter-spacing:.09em;
  font-size:1rem; padding:.35rem .6rem; border-radius:6px; white-space:nowrap; }
.menu a:hover{ color:var(--creme); }
.menu a.atual{ color:var(--brilho); box-shadow:inset 0 -2px 0 var(--brilho); }
.menu .rede{ display:flex; align-items:center; padding:.35rem .4rem; }
.menu .rede svg{ width:20px; height:20px; fill:none; stroke:var(--fumaca);
  stroke-width:1.7; }
.menu .rede:hover svg{ stroke:var(--brilho); }
.menu .vazio{ flex:1 0 auto; }

/* ---------- estrutura ---------- */
.pagina{ max-width:760px; margin:0 auto;
  padding:1.4rem 1.1rem calc(3rem + env(safe-area-inset-bottom)); }
h1.titulo{ font-family:var(--cond); text-transform:uppercase; letter-spacing:.05em;
  font-size:clamp(1.6rem,7vw,2.2rem); margin:.2rem 0 .1rem; }
.subtitulo{ color:var(--fumaca); font-size:.92rem; margin:.2rem 0 1.4rem;
  line-height:1.5; }

/* divisória em X, como a da bandeira */
.cruz{ display:block; width:min(300px,74vw); height:26px; margin:1.3rem auto 1.4rem; }

/* ---------- botões ---------- */
.botao{ display:inline-block; text-decoration:none; font-family:var(--cond);
  text-transform:uppercase; letter-spacing:.1em; font-size:1.1rem; font-weight:700;
  color:#101408; background:linear-gradient(180deg,var(--brilho),var(--ouro));
  padding:.72rem 2rem; border-radius:999px; border:none; cursor:pointer;
  box-shadow:0 12px 28px rgba(214,166,60,.2);
  transition:transform .15s, filter .15s; }
.botao:hover{ filter:brightness(1.08); transform:translateY(-2px); }
.botao:active{ transform:translateY(0); }
.botao.fantasma{ background:transparent; color:var(--creme);
  border:1px solid rgba(214,166,60,.55); box-shadow:none; font-size:1rem;
  padding:.6rem 1.4rem; }
.botao.fantasma:hover{ color:var(--brilho); border-color:var(--brilho); }

/* ---------- cartões ---------- */
.cartao{ border:1px solid rgba(214,166,60,.35); border-top:3px solid var(--ouro);
  border-radius:12px; overflow:hidden; margin-bottom:1.1rem;
  background:linear-gradient(180deg, rgba(46,90,44,.16), rgba(14,18,12,.6)); }
.cartao .conteudo{ padding:.9rem 1rem 1.1rem; }
.cartao h2{ font-family:var(--cond); text-transform:uppercase; letter-spacing:.04em;
  font-size:1.35rem; margin:0 0 .2rem; }
.cartao p{ margin:.35rem 0; font-size:.93rem; line-height:1.5; }
.preco{ font-family:var(--cond); font-size:1.6rem; color:var(--brilho);
  line-height:1; margin:.5rem 0 .2rem; }
.miudo{ font-size:.8rem; color:var(--fumaca); }

.aviso{ border:1px solid rgba(214,166,60,.45); background:rgba(214,166,60,.12);
  border-radius:10px; padding:.75rem .9rem; font-size:.88rem; line-height:1.5;
  margin-bottom:1.2rem; }
