/* ===== CORES E FONTES =====
   Variáveis usadas no site todo: mude uma cor aqui e ela muda em todos os lugares. */
:root{
  --vinho:#6E0F1C; --vermelho:#B8142A; --preto:#121014; --ouro:#E2B044;
  --papel:#F7F4EF; --tinta:#1A1416; --tinta-suave:#5E5257; --linha:#E2D9D0; --cartao:#FFFFFF;
  --display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --texto:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
/* ===== TEMA ESCURO =====
   1º bloco: segue o tema do celular/computador; 2º bloco: quando a pessoa clica no botão ◐ */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){--papel:#120E10;--tinta:#F3ECE6;--tinta-suave:#B9ACA6;--linha:#2E2427;--cartao:#1C1618}
}
:root[data-theme="dark"]{--papel:#120E10;--tinta:#F3ECE6;--tinta-suave:#B9ACA6;--linha:#2E2427;--cartao:#1C1618}
/* ===== BASE ===== */
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 64px)}
body{margin:0;background:var(--papel);color:var(--tinta);font-family:var(--texto);font-size:1.0625rem;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--ouro);outline-offset:3px}

/* ===== BARRA DE NAVEGAÇÃO ===== */
.barra{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--preto);color:#fff;border-bottom:3px solid var(--ouro)}
.barra-in{max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:.5rem;padding:.6rem 1rem}
.marca{font-family:var(--display);font-weight:800;font-size:1.35rem;letter-spacing:.02em;margin-right:auto;white-space:nowrap;text-decoration:none}
.marca-tag{font-family:var(--texto);font-weight:600;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ouro);border:1px solid var(--ouro);border-radius:999px;padding:.15rem .55rem;margin-left:.4rem;vertical-align:.2em}
.barra nav{display:flex;gap:.25rem}
.barra nav a{font-weight:500;font-size:.95rem;text-decoration:none;padding:.45rem .7rem;border-radius:999px;white-space:nowrap}
.barra nav a:hover{background:rgba(255,255,255,.12)}
.btn-tema{background:none;border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:999px;width:2.4rem;height:2.4rem;flex:none;cursor:pointer;font-size:1.05rem}

/* ===== TOPO (HERO) — listras vinho imitando a camisa do clube ===== */
.hero{color:#fff;position:relative;overflow:hidden;
  background:repeating-linear-gradient(90deg,var(--vinho) 0 70px,#5A0C17 70px 140px)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,16,20,.85) 0%,rgba(18,16,20,.35) 60%,rgba(18,16,20,.1));pointer-events:none}
.hero-in{position:relative;z-index:1;max-width:1100px;margin:0 auto;padding:3rem 1.25rem 3.5rem;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:2rem;align-items:center}
.hero h1{margin-top:0;font-family:var(--display);font-weight:800;font-size:clamp(2.6rem,7vw,4.4rem);line-height:.92;margin:0 0 .7rem}
.hero .posicao{font-size:1.15rem;margin:0 0 1.6rem;color:#F0DCC8}
.acoes{display:flex;flex-wrap:wrap;gap:.75rem}
.btn{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;text-decoration:none;padding:.8rem 1.3rem;border-radius:999px;border:2px solid transparent}
.btn-ouro{background:var(--ouro);color:var(--preto)}
.btn-borda{border-color:rgba(255,255,255,.6);color:#fff}
.btn-borda:hover{background:rgba(255,255,255,.1)}
.foto-atleta{aspect-ratio:4/5;border-radius:1.25rem;overflow:hidden;border:6px solid var(--ouro);transform:rotate(2deg);box-shadow:0 20px 45px rgba(0,0,0,.45);justify-self:center;width:min(100%,380px)}
.foto-atleta img{width:100%;height:100%;object-fit:cover;object-position:35% 20%}

/* ===== SEÇÕES ===== */
main{max-width:1100px;margin:0 auto;padding:0 1.25rem}
section{padding:3.5rem 0 1rem}
h2{font-family:var(--display);font-weight:800;font-size:clamp(2rem,4.5vw,2.8rem);line-height:1;margin:0 0 1.5rem}

/* ===== FICHA DA ATLETA ===== */
.ficha-grade{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:1.5rem;align-items:start}
.ficha{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));border-top:3px solid var(--tinta);margin:0}
.ficha div{padding:1rem .25rem 1.1rem;border-bottom:1px solid var(--linha)}
.ficha dt{color:var(--tinta-suave);font-size:.9rem}
.ficha dd{margin:.1rem 0 0;font-family:var(--display);font-weight:700;font-size:1.7rem;line-height:1.1}
.altura{background:var(--preto);color:#fff;border-radius:1rem;padding:1.5rem;border-left:6px solid var(--vermelho)}
.altura b{display:block;font-family:var(--display);font-size:clamp(3.2rem,8vw,4.5rem);line-height:1;color:var(--ouro)}
.altura small{color:#D9CCC4}

/* ===== VÍDEO: capa clicável que vira o player do YouTube ===== */
.video-card{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);background:var(--cartao);border:1px solid var(--linha);border-radius:1.25rem;overflow:hidden}
.player{aspect-ratio:16/9;background:#000;overflow:hidden}
.player-capa{display:block;width:100%;height:100%;border:0;padding:0;cursor:pointer;background:none}
.player-capa img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.player-capa:hover img{transform:scale(1.03)}
.player iframe{width:100%;height:100%;border:0;display:block}
.video-card .txt{padding:1.5rem;display:flex;flex-direction:column;justify-content:center;gap:.5rem}
.video-card h3{font-family:var(--display);font-size:1.8rem;line-height:1.05;margin:0}
.video-card p{margin:0;color:var(--tinta-suave)}
.video-card .ir{margin-top:.5rem;font-weight:600;color:var(--vermelho)}
:root[data-theme="dark"] .video-card .ir{color:var(--ouro)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .video-card .ir{color:var(--ouro)}}

/* ===== GALERIA DE FOTOS ===== */
.grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.item{position:relative;display:block;aspect-ratio:4/5;border-radius:.75rem;overflow:hidden;background:var(--linha);border:0;padding:0;cursor:zoom-in;width:100%}
.item img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.item:hover img{transform:scale(1.04)}
.item .leg{position:absolute;left:0;right:0;bottom:0;padding:1.75rem .8rem .7rem;background:linear-gradient(transparent,rgba(10,6,8,.85));color:#fff;font-size:.9rem;text-align:left;font-family:var(--texto)}

/* ===== FOTO AMPLIADA ===== */
.lightbox{position:fixed;inset:0;z-index:50;background:rgba(10,6,8,.94);display:none;align-items:center;justify-content:center;padding:calc(env(safe-area-inset-top,0px) + 3.5rem) 1rem calc(env(safe-area-inset-bottom,0px) + 3.5rem)}
.lightbox.aberta{display:flex}
.lightbox figure{margin:0;max-width:min(1000px,100%);display:flex;flex-direction:column;align-items:center}
.lightbox img{max-height:78vh;border-radius:.5rem}
.lightbox figcaption{color:#fff;margin-top:.75rem;text-align:center}
.lb-btn{position:absolute;background:rgba(255,255,255,.14);color:#fff;border:0;width:3rem;height:3rem;border-radius:50%;font-size:1.4rem;cursor:pointer}
.lb-fechar{top:calc(env(safe-area-inset-top,0px) + .75rem);right:1rem}
.lb-ant{left:.75rem;top:50%;transform:translateY(-50%)}
.lb-prox{right:.75rem;top:50%;transform:translateY(-50%)}

/* ===== CONTATO ===== */
.contato{background:var(--preto);color:#fff;border-radius:1.5rem;padding:2.5rem 1.5rem;margin:1.5rem 0 3rem;border-top:6px solid var(--ouro)}
.contato h2{color:#fff}
.contato p{color:#D9CCC4;max-width:55ch;margin:0 0 1.5rem}
.contato-topo{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem 1.25rem;margin-bottom:1.75rem}
.contato-topo h2,.contato-topo p{margin:0}
/* Ícones das redes, no estilo do portfólio do Gabriel */
.contato-social{display:flex;flex-wrap:wrap;justify-content:center;gap:1.25rem 2.5rem;padding:.5rem 0}
.contato-social a{display:flex;flex-direction:column;align-items:center;text-decoration:none;min-width:110px;transition:transform .2s}
.contato-social a:hover{transform:translateY(-5px)}
.contato-social .icone{width:64px;height:64px;border-radius:50%;background:#fff;display:grid;place-items:center;margin-bottom:.6rem;transition:transform .3s}
.contato-social a:hover .icone{transform:scale(1.1)}
.contato-social svg{width:34px;height:34px}
.contato-social .instagram svg{fill:#E1306C}
.contato-social .youtube svg{fill:#FF0000}
.contato-social .whatsapp svg{fill:#25D366}
.contato-social b{font-size:1rem}
.contato-social small{color:#D9CCC4;font-size:.85rem}
/* ===== BOTÃO VOLTAR AO INÍCIO (começa invisível; a classe .visivel mostra) ===== */
.btn-voltar-topo{position:fixed;right:1rem;bottom:calc(env(safe-area-inset-bottom,0px) + 1rem);z-index:30;background:var(--ouro);color:var(--preto);font-weight:600;text-decoration:none;padding:.75rem 1.1rem;border-radius:999px;box-shadow:0 8px 20px rgba(0,0,0,.3);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .3s,visibility .3s,transform .3s}
.btn-voltar-topo.visivel{opacity:1;visibility:visible;transform:none}
footer{text-align:center;color:var(--tinta-suave);font-size:.9rem;padding:0 1rem 2rem}

/* ===== CELULAR: regras que valem só em telas até 760px ===== */
@media (max-width:760px){
  .barra nav{display:none}
  .marca{font-size:1.15rem}
  .marca-tag{font-size:.62rem;padding:.1rem .45rem}
  .hero::after{background:linear-gradient(180deg,rgba(18,16,20,.2),rgba(18,16,20,.85) 55%)}
  .hero-in{grid-template-columns:1fr;padding-top:2rem}
  .foto-atleta{order:-1;width:min(80%,320px);transform:rotate(-2deg)}
  .ficha-grade,.video-card{grid-template-columns:1fr}
  .grade{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.item img,.video-card img{transition:none}}
