﻿.sessao-localizacao 
{ height: calc(100vh - clamp(6.09rem, 7.1vw, 17vh)); height: calc(100svh - clamp(6.09rem, 7.1vw, 17svh)); box-sizing: border-box; 
  padding: clamp(1.8rem, 2vw, 4.1vh); background-color: rgb(114, 0, 46); display: flex; flex-direction: column;
}

.sessao-localizacao h2 
{ line-height: 1; color: rgb(243, 238, 234); font-family: "poppinssemibold"; letter-spacing: 0.05rem; font-size: clamp(1.98rem, 2.325vw, 5.3vh); 
  margin-bottom: clamp(1.32rem, 1.37vw, 2.85vh) }

.imagem-mapa-computador { display: block }

.imagem-mapa-celular-em-pe { display: none }

.mapa { width: auto; height: 100%; aspect-ratio: 1189 / 493; position: relative; overflow: hidden; cursor: pointer; }

.mapa img, .mapa iframe { width: 100%; height: 100%; object-fit: cover; object-position: center; position: absolute; top: 0; left: 0; }

.mapa::after
{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(73, 16, 35, 0.4); opacity: 0; transition: opacity 0.3s ease;
  z-index: 5; pointer-events: none; }

.mapa:hover::after { opacity: 1; }

.map-overlay
{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; background-color: rgba(73, 16, 35, 0.75); color: #ffffff; 
  padding: 10px 25px; border-radius: 50px; font-family: "montserratlight"; font-size: clamp(0.8rem, 1vw, 1.2rem); font-weight: bold; width: max-content; 
  display: inline-block; white-space: nowrap; letter-spacing: 0.05rem; border: 1px solid rgba(255, 255, 255, 0.3); transition: all 0.3s ease;
  pointer-events: none; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); }

.map-overlay:focus { outline: none; border-color: #ffffff; box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.5); }

.mapa:hover .map-overlay, .mapa:focus-within .map-overlay { background-color: rgb(73, 16, 35); transform: translate(-50%, 0%) scale(1.05); border-color: #ffffff; }

.mapa.mapa-ativo::after, .mapa.mapa-ativo .map-overlay { display: none; }

.mapa { touch-action: pan-y; -webkit-overflow-scrolling: touch; }

.mapa.mapa-ativo { touch-action: auto; -ms-touch-action: auto }

.mapa-ativo iframe { pointer-events: auto; touch-action: auto; }

/*Celular em pé*/

@media only screen and (max-device-width : 600px) and (orientation: portrait)
{
.sessao-localizacao 
{ display: flex; flex-direction: column; justify-content: flex-start; min-height: calc(100svh - 5.15rem); height: auto; 
  padding: 1.7rem 0.6rem; box-sizing: border-box; position: relative; z-index: 10; background-color: rgb(114, 0, 46); }

.sessao-localizacao h2 
{ line-height: 1; color: rgb(243, 238, 234); font-family: "poppinssemibold"; letter-spacing: 0.05rem; font-size: 1.46rem; margin-bottom: 1.7rem }

.imagem-mapa-computador { display: none }

.imagem-mapa-celular-em-pe { display: block }

.mapa { width: 100%; display: block; position: relative; height: 105vw; height: max(105vw, calc(100svh - 8rem)); cursor: pointer; }

/*@supports (height: max(1vw, 1px)) { .mapa { height: max(105vw, calc(100vh - 22rem)); height: max(105vw, calc((var(--vh, 1vh) * 100) - 22rem)); height: max(105vw, calc(100svh - 22rem)); } }*/

.mapa img, .mapa iframe { width: 100%; height: 100%; object-fit: cover; object-position: center; position: absolute; top: 0; left: 0; }

.mapa::after
{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(73, 16, 35, 0.4); opacity: 0; transition: opacity 0.3s ease;
  z-index: 5; pointer-events: none; }

.mapa:hover::after { opacity: 1; }

.map-overlay
{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; background-color: rgba(73, 16, 35, 0.75); color: #ffffff; 
  padding: 0.6rem; border-radius: 50px; font-family: "montserratlight"; font-size: 1rem; font-weight: bold; width: 75%; width: max(75%, 17rem); text-align: center;
  display: block; white-space: normal; letter-spacing: 0.05rem; border: 1px solid rgba(255, 255, 255, 0.3); transition: all 0.3s ease;
  pointer-events: none; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); }

.mapa { touch-action: pan-y; -webkit-overflow-scrolling: touch; }

.mapa.mapa-ativo { touch-action: auto; -ms-touch-action: auto }

.mapa-ativo iframe { pointer-events: auto; touch-action: auto; }
}

/*ipad em pé e deitado*/
@media only screen and (min-width: 601px) and (max-width: 1280px) and (min-height: 601px) 
{
.sessao-localizacao
{ display: flex; flex-direction: column; height: calc(100vh - 16.7rem); height: calc(100svh - 16.7rem); box-sizing: border-box; background-color: rgb(114, 0, 46); 
  overflow: hidden; width: 100%; padding: 1.7rem 0.6rem 0.7rem 0.6rem; justify-content: flex-start }

.sessao-localizacao h2 
{ line-height: 1; color: rgb(243, 238, 234); font-family: "poppinssemibold"; letter-spacing: 0.05rem; font-size: 1.98rem; margin-bottom: 1.4rem; padding-top: 0; }

.mapa { width: auto; height: 100%; aspect-ratio: 1189 / 493; position: relative; overflow: hidden; cursor: pointer; }

.map-overlay { padding: 0.6rem 0.6rem 0.6rem 0.6rem; font-size: 0.8rem; font-weight: bold; width: 17rem; text-align: center; }
}

/*Mídia móvel deitado*/

/*tim*/
@media screen and (max-device-width : 570px) and (orientation : landscape) 
{
.sessao-localizacao 
{ display: flex; flex-direction: column; justify-content: flex-start; min-height: 40.7vw; height: auto; padding: 1.7rem 0.6rem; box-sizing: border-box; 
  position: relative; z-index: 10; background-color: rgb(114, 0, 46); }

.sessao-localizacao h2 
{ line-height: 1; color: rgb(243, 238, 234); font-family: "poppinssemibold"; letter-spacing: 0.05rem; font-size: 1.46rem; margin-bottom: 1.5rem }

.imagem-mapa-computador { display: none }

.imagem-mapa-celular-em-pe { display: block }

.mapa { width: 100%; display: block; position: relative; height: 105vw; cursor: pointer; }

.mapa img, .mapa iframe { width: 100%; height: 100%; object-fit: cover; object-position: center; position: absolute; top: 0; left: 0; }

.mapa::after
{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(73, 16, 35, 0.4); opacity: 0; 
  transition: opacity 0.3s ease; z-index: 5; pointer-events: none; }

.mapa:hover::after { opacity: 1; }

.map-overlay
{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; background-color: rgba(73, 16, 35, 0.75); color: #ffffff; 
  padding: 0.6rem; border-radius: 50px; font-family: "montserratlight"; font-size: 1rem; font-weight: bold; width: 19rem; text-align: center;
  display: block; white-space: normal; letter-spacing: 0.05rem; border: 1px solid rgba(255, 255, 255, 0.3); transition: all 0.3s ease;
  pointer-events: none; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); }

.mapa { touch-action: pan-y; -webkit-overflow-scrolling: touch; }

.mapa.mapa-ativo { touch-action: auto; -ms-touch-action: auto }

.mapa-ativo iframe { pointer-events: auto; touch-action: auto; }
}

/*IPHONE MÃE*/
@media screen and (min-width: 571px) and (max-width: 670px) and (orientation: landscape) 
{
.sessao-localizacao 
{ display: flex; flex-direction: column; justify-content: flex-start; min-height: 40.7vw; height: auto; padding: 1.7rem 0.6rem; box-sizing: border-box; 
  position: relative; z-index: 10; background-color: rgb(114, 0, 46); }

.sessao-localizacao h2 
{ line-height: 1; color: rgb(243, 238, 234); font-family: "poppinssemibold"; letter-spacing: 0.05rem; font-size: 1.46rem; margin-bottom: 1.5rem }

.imagem-mapa-computador { display: block }

.imagem-mapa-celular-em-pe { display: none }

.mapa { width: 100%; display: block; position: relative; height: 40.7vw; cursor: pointer; }

.mapa img, .mapa iframe { width: 100%; height: 100%; object-fit: cover; object-position: center; position: absolute; top: 0; left: 0; }

.mapa::after
{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(73, 16, 35, 0.4); opacity: 0; transition: opacity 0.3s ease;
  z-index: 5; pointer-events: none; }

.mapa:hover::after { opacity: 1; }

.map-overlay
{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; background-color: rgba(73, 16, 35, 0.75); color: #ffffff; 
  padding: 0.6rem; border-radius: 50px; font-family: "montserratlight"; font-size: 1rem; font-weight: bold; width: 19rem; text-align: center;
  display: block; white-space: normal; letter-spacing: 0.05rem; border: 1px solid rgba(255, 255, 255, 0.3); transition: all 0.3s ease;
  pointer-events: none; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); }

.mapa { touch-action: pan-y; -webkit-overflow-scrolling: touch; }

.mapa.mapa-ativo { touch-action: auto; -ms-touch-action: auto }

.mapa-ativo iframe { pointer-events: auto; touch-action: auto; }
}

/*Celulares grandes*/

@media only screen and (min-width: 671px) and (max-height: 600px) and (orientation: landscape) and (pointer: coarse) 
{
.sessao-localizacao 
{ display: flex; flex-direction: column; justify-content: flex-start; min-height: 40.7vw; height: auto; padding: 1.7rem 0.6rem; box-sizing: border-box; 
  position: relative; z-index: 10; background-color: rgb(114, 0, 46); }

.sessao-localizacao h2 
{ line-height: 1; color: rgb(243, 238, 234); font-family: "poppinssemibold"; letter-spacing: 0.05rem; font-size: 1.46rem; margin-bottom: 1.5rem }

.imagem-mapa-computador { display: block }

.imagem-mapa-celular-em-pe { display: none }

.mapa { width: 100%; display: block; position: relative; height: 40.7vw; cursor: pointer; }

.mapa img, .mapa iframe { width: 100%; height: 100%; object-fit: cover; object-position: center; position: absolute; top: 0; left: 0; }

.mapa::after
{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(73, 16, 35, 0.4); opacity: 0; transition: opacity 0.3s ease;
  z-index: 5; pointer-events: none; }

.mapa:hover::after { opacity: 1; }

.map-overlay
{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; background-color: rgba(73, 16, 35, 0.75); color: #ffffff; 
  padding: 0.6rem; border-radius: 50px; font-family: "montserratlight"; font-size: 1rem; font-weight: bold; width: 17rem; text-align: center;
  display: block; white-space: normal; letter-spacing: 0.05rem; border: 1px solid rgba(255, 255, 255, 0.3); transition: all 0.3s ease;
  pointer-events: none; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); }

.mapa { touch-action: pan-y; -webkit-overflow-scrolling: touch; }

.mapa.mapa-ativo { touch-action: auto; -ms-touch-action: auto }

.mapa-ativo iframe { pointer-events: auto; touch-action: auto; }

}
