/* Solunar Chalés — catálogo de fotos
   ==================================================================
   TODAS as imagens do site ficam aqui. Para trocar uma foto, aponte a
   variável para outro arquivo dentro da pasta img/.

   CAMINHO: este arquivo está em  css/images.css, então
   "../img/foto.jpg"  =  <pasta do site>/img/foto.jpg

   Cada foto está escrita duas vezes, .jpg e .jpeg. O navegador usa a
   que existir — assim não importa com qual das duas terminações o
   arquivo foi salvo. Nomes NÃO podem ter espaço nem parêntese.
   ================================================================== */

:root {
  /* ---- Topo do site ---- */
  --photo-hero:        url("../img/hero.jpg"),        url("../img/hero.jpeg");

  /* ---- Seção "O chalé" — 1 foto grande + 4 menores ---- */
  --photo-chale-frente: url("../img/chale-frente.jpg"), url("../img/chale-frente.jpeg");
  --photo-cama-casal:   url("../img/cama-casal.jpg"),   url("../img/cama-casal.jpeg");
  --photo-beliche:      url("../img/beliche.jpg"),      url("../img/beliche.jpeg");
  --photo-banheiro:     url("../img/banheiro.jpg"),     url("../img/banheiro.jpeg");
  --photo-cozinha:      url("../img/interior-1.jpg"),   url("../img/interior-1.jpeg");

  /* ---- Galeria — 12 fotos, na ordem em que aparecem ---- */
  --photo-gal-1:  url("../img/tenda-noite.jpg"),  url("../img/tenda-noite.jpeg");   /* destaque 2x2 */
  --photo-gal-2:  url("../img/chale-dia.jpg"),    url("../img/chale-dia.jpeg");
  --photo-gal-3:  url("../img/fogueira.jpg"),     url("../img/fogueira.jpeg");
  --photo-gal-4:  url("../img/mata.jpg"),         url("../img/mata.jpeg");
  --photo-gal-5:  url("../img/mesa.jpg"),         url("../img/mesa.jpeg");
  --photo-gal-6:  url("../img/copas.jpg"),        url("../img/copas.jpeg");
  --photo-gal-7:  url("../img/chale-frente.jpg"), url("../img/chale-frente.jpeg");
  --photo-gal-8:  url("../img/palmeiras.jpg"),    url("../img/palmeiras.jpeg");
  --photo-gal-9:  url("../img/interior-2.jpg"),   url("../img/interior-2.jpeg");
  --photo-gal-10: url("../img/arvores.jpg"),      url("../img/arvores.jpeg");
  --photo-gal-11: url("../img/chale-noite.jpg"),  url("../img/chale-noite.jpeg");
  --photo-gal-12: url("../img/mata-verde.jpg"),   url("../img/mata-verde.jpeg");

  /* ---- Vila Calderita ----------------------------------------------
     Os cards da vila podem ter foto. Como ainda não existem, os arquivos
     abaixo estão só reservados. Para ligar a foto de um card:
       1. coloque o arquivo em img/ com o nome indicado aqui;
       2. no index.html, acrescente a classe "has-photo" naquele card,
          assim:  <article class="vila-card has-photo">
     Enquanto a classe não estiver lá, o card aparece só com texto.     */
  --photo-vila-praia:   url("../img/vila-praia.jpg"),   url("../img/vila-praia.jpeg");
  --photo-vila-barco:   url("../img/vila-barco.jpg"),   url("../img/vila-barco.jpeg");
  --photo-vila-comida:  url("../img/vila-comida.jpg"),  url("../img/vila-comida.jpeg");
  --photo-vila-porsol:  url("../img/vila-porsol.jpg"),  url("../img/vila-porsol.jpeg");
  --photo-vila-festival:url("../img/vila-festival.jpg"),url("../img/vila-festival.jpeg");
  --photo-vila-compras: url("../img/vila-compras.jpg"), url("../img/vila-compras.jpeg");
  --photo-vila-estrada: url("../img/vila-estrada.jpg"), url("../img/vila-estrada.jpeg");
  --photo-vila-mata:    url("../img/mata-verde.jpg"),   url("../img/mata-verde.jpeg");
}

/* Ligação entre as variáveis e os elementos marcados com data-photo.
   O seletor duplicado ([data-photo][data-photo]) aumenta a
   especificidade para vencer as regras de fundo do landing.css.      */
[data-photo="chale-frente"][data-photo] { background-image: var(--photo-chale-frente); }
[data-photo="cama-casal"][data-photo]   { background-image: var(--photo-cama-casal); }
[data-photo="beliche"][data-photo]      { background-image: var(--photo-beliche); }
[data-photo="banheiro"][data-photo]     { background-image: var(--photo-banheiro); }
[data-photo="cozinha"][data-photo]      { background-image: var(--photo-cozinha); }

[data-photo="gal-1"][data-photo]  { background-image: var(--photo-gal-1); }
[data-photo="gal-2"][data-photo]  { background-image: var(--photo-gal-2); }
[data-photo="gal-3"][data-photo]  { background-image: var(--photo-gal-3); }
[data-photo="gal-4"][data-photo]  { background-image: var(--photo-gal-4); }
[data-photo="gal-5"][data-photo]  { background-image: var(--photo-gal-5); }
[data-photo="gal-6"][data-photo]  { background-image: var(--photo-gal-6); }
[data-photo="gal-7"][data-photo]  { background-image: var(--photo-gal-7); }
[data-photo="gal-8"][data-photo]  { background-image: var(--photo-gal-8); }
[data-photo="gal-9"][data-photo]  { background-image: var(--photo-gal-9); }
[data-photo="gal-10"][data-photo] { background-image: var(--photo-gal-10); }
[data-photo="gal-11"][data-photo] { background-image: var(--photo-gal-11); }
[data-photo="gal-12"][data-photo] { background-image: var(--photo-gal-12); }

[data-photo="vila-praia"][data-photo]    { background-image: var(--photo-vila-praia); }
[data-photo="vila-barco"][data-photo]    { background-image: var(--photo-vila-barco); }
[data-photo="vila-comida"][data-photo]   { background-image: var(--photo-vila-comida); }
[data-photo="vila-porsol"][data-photo]   { background-image: var(--photo-vila-porsol); }
[data-photo="vila-festival"][data-photo] { background-image: var(--photo-vila-festival); }
[data-photo="vila-compras"][data-photo]  { background-image: var(--photo-vila-compras); }
[data-photo="vila-estrada"][data-photo]  { background-image: var(--photo-vila-estrada); }
[data-photo="vila-mata"][data-photo]     { background-image: var(--photo-vila-mata); }