@import url('https://fonts.googleapis.com/css2?family=Caveat&family=Kalam:wght@300&family=Roboto+Condensed:wght@100&family=Roboto:wght@100&family=Syne&display=swap');
body{
    font-family: 'Syne', sans-serif;
}

.banner2{
    background-image: url("../imagenes/japanesse-banner.png");
    background-size: cover;
    background-position: center ;
    height: 68vh;
    box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.452);
    background-color:rgba(67, 65, 65, 0.265);
    background-blend-mode: multiply;
    background-attachment: fixed;
  
}

/* 1) Contenedor del header/video: contexto de posicionamiento */
.video-head{
  position: relative;
  width: 100vw;  /* ocupa todo el ancho de la ventana */
  height: 100vh; /* altura consistente con el video y overlay */
  overflow: hidden;
}


/* 2) Video a pantalla completa dentro del contenedor */
.video-banner {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.video-head::before { 
 content: "";
  position: absolute;
  inset: 0;               /* top/right/bottom/left: 0 */
  background-color: rgba(35, 35, 35, 0.336);
  z-index: 1;             /* debajo del overlay */
  pointer-events: none;

}


.video-banner {
  width: 100vw;      /* ancho total de la pantalla */
  height: 100vh;     /* alto total de la pantalla */
  object-fit: cover; /* recorta sin deformar */
}

.overlay {
    position: absolute;
    top: 10%; /* Ajusta la posición vertical del texto */
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    color: white;
    font-size: 2em;
    z-index: 1;
}
.custom-shape-divider-bottom-1709077937 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    transform: rotate(180deg);
}
.custom-shape-divider-bottom-1709077937 svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 83px;
}
.custom-shape-divider-bottom-1709077937 .shape-fill {
    fill:#F7E6C4;
}
.section1{
    background-color:#07030f;
}
.img-context{
    background-position: center ;
    background-color: #0c0c0ce7;
    background-blend-mode: multiply;
}
.price-table:hover {
    margin-top: 40px;
    z-index: 10;    
}
.imgs{
    width: 100%;
}
.sections{
    background-color: #000;
}
.imgs1{
    width: 50%;
    clip-path: circle();   
}
.border-right {
    border-right: 1px solid #F7E6C4; /* Establece un borde derecho de 1px sólido de color negro */
}
.linea-lateral {
    position: relative;
} 
 .linea-lateral::before,
  .linea-lateral::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 30px; /* Ancho de las líneas */
    height: 1px; /* Grosor de las líneas */
    background-color: #F7E6C4; /* Color de las líneas */
    margin-top: -0.5px; /* La mitad del grosor de las líneas para centrarlas verticalmente */
  }
  .linea-lateral::before {
    left: -60px; /* Posiciona la línea a la izquierda de la palabra */
  }
  .linea-lateral::after {
    right: -60px; /* Posiciona la línea a la derecha de la palabra */
  }
.btnes{
    padding: 10px 20px;
    cursor: pointer;
    border: 1px solid #F7E6C4;
    border-radius: 2px;
    background-color:#07030f;
    color:#ffff;
    font-size: 18px;
}
.btnes:hover{
    background-color: #F7E6C4;
    color: #07030f;
}

/* Tamaño consistente de íconos */
.icons {
  width: 32px;
  height: 32px;
  display: inline-block;
}

/* Si tu footer usa fondo oscuro y texto claro */
footer {
  color: #111; /* Ajusta según tu tema */
}
footer .icons {
  color: currentColor; /* hace que el trazo use el color del texto */
}

/* Opcional: si se ven muy pequeños en desktop */
@media (min-width: 992px) {
  .icons { width: 36px; height: 36px; }
}

.linea {
    border-top: 1px solid #F7E6C4;
    height: 2px;
    max-width: 150px;
    padding: 0;
    margin: 20px auto 0 auto;
}
footer{
    background-color: #F7E6C4;
}
/*shape del footer*/
.custom-shape-divider-top-1709094903 {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
}
.custom-shape-divider-top-1709094903 svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 83px;
}
.custom-shape-divider-top-1709094903 .shape-fill {
    fill: #07030f;
}
.logo{
    width:55%;
}
.animation1{
    width: 650px;
    height: 200px;
}
.logo-footer{
    width:12%;
}
a{
    text-decoration: none;
    color:black ;
}
a:hover{
    text-decoration: none;
    color:black ;
}
.text{
    display: inline-block;
}
.goto-top{  
    position: fixed;
    bottom: 30px;
    right: 20px;     /*para que el boton de scrolltop se ponga del lado derecho*/
    width: 50px;
    height: 30px;
}
.widget_blog_subscription {
	display: block;
	margin: 40px auto;
	color: #000;
	max-width: 490px;
	min-width: 320px;
	position: relative;
	overflow: hidden;
	background-color: #F7E6C4;
}
.widget_blog_subscription p {
	margin: 0;
	text-align: center;
}
.widget_blog_subscription p:first-child {
	margin: 40px 15px 0;
	text-align: center;
	font-size: 16px;  
}
.widget_blog_subscription input[type="text"] {
	margin: 45px 30px;
	padding: 25px 15px !important;
	text-align: center;
	width: 100% !important;
	max-width: calc(100% - 90px);
	outline: none;
	border: 0;
	font-size: 16px;
}
.widget_blog_subscription input[type="button"] {
    background-color: #000;
    color: #fff;
    padding: 25px 15px !important;
    text-align: center;
    width: 100%;
    max-width: 80%;
    outline: none;
    border: 0;
    font-size: 16px;
    cursor: pointer;
    -webkit-transition: .1s all ease-in-out;
    -moz-transition: .1s all ease-in-out;
    -o-transition: .1s all ease-in-out;
    transition: .1s all ease-in-out;
}
.img-content:hover{
    scale:1.1;
    z-index: 1000;
}
.card1{
    width: 80%;
    border: 2px solid #F7E6C4;
}


/* Este patrón hace que el bloque abarque todo el viewport horizontal
   incluso si está dentro de un flujo con margins/paddings previos */
.map-wrapper {
  width: 100vw;
  margin-left: calc(50% - 50vw); /* truco para romper el ancho del container */
  margin-right: calc(50% - 50vw);
  height: 500px; /* o 60vh si lo quieres responsivo en alto */
  overflow: hidden;
}

.map-wrapper iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

/* Tamaño al Lottie para que no quede pequeño ni desalineado */
.lottie-embed {
  width: min(420px, 90vw);
  height: 220px;            
  border: 0;
  display: block;
  margin: 0 auto;
}