.venter{     background-image: url(../images/back3.jpg);    background-size: cover;    background-position: center;    height: 100vh;    width: 100vw;    position: relative;    color:white;    display: flex;    
    justify-content: center;    align-items: center;    text-align: center;}
.venter1{    display: flex;    flex-direction: column;    align-items: center;    text-align: center;    color: white;}

@media screen and (max-width: 768px) {
    .venter {
        background-size: cover;
        height: auto;
        padding: 20px;
    }
    .venter h1{
        font-size: 6vw;
    }
    .nav-menu {
        flex-direction: column;
    }    
}
/* Chakra Numerology文字設定 */.title{    font-size: 72px;    color: white;    position: absolute;    top: 570px;    left: 310px;}
/* Chakra Numerology副標題文字設定 */.description{    font-size: 14px;    color: white;    font-family: "IBM Plex Sans", sans-serif;      position: absolute;    top: 670px;    left: 460px;}


/* 设置全局字体和颜色 */body {    font-family: "Noto Serif", serif;    color: #5e3a28;    background-color: #f9f7eb;    margin: 0;    padding: 0;}


/* Flexbox A different lifestyle的設定 */.container {    display: flex;    justify-content: space-between;    align-items: center; /* 垂直居中 */    padding: 50px; /* 给内容添加内边距 */    max-width: 1200px; /* 最大宽度 */
        margin: 0 auto; /* 让容器在页面居中 */}
/* 左侧标题样式 */
.left h1 {    font-size: 3rem; /* 标题大小 */    line-height: 1.2; /* 行高 */    margin: 0;    color: #7b4b2a; /* 深棕色的字体 */}
/* 右侧内容样式 */
.right {    max-width: 500px; /* 限制右侧说明文字的最大宽度 */}
.right h2 {    font-size: 1.5rem;    margin-bottom: 10px;    color: #5e3a28; /* 标题颜色 */    font-family: "IBM Plex Sans", sans-serif;  }
.right p {    font-size: 1.2rem;    color: #5e3a28;    line-height: 1.6; /* 行高，增加可读性 */    border-left: 2px solid #5e3a28; /* 左侧的竖线 */    padding-left: 10px; /* 竖线与文字的间距 */    font-family: "IBM Plex Sans", sans-serif;  }


/* Flexbox 三個圖片的設定 */.card-container {    display: flex;    justify-content: space-between; /* 卡片间保持相等距离 */    gap: 20px; /* 卡片之间的间隙 */    margin: 0 auto;    max-width: 1200px;    overflow: auto;}
.card {    background-color: #fff; /* 白色背景 */    border: 1px solid #ccc; /* 灰色边框 */    border-radius: 8px; /* 圆角 */    padding: 15px; /* 内边距 */
    flex: 1; /* 每个卡片平分宽度 */    text-align: center; /* 文字居中 */    transition: transform 0.2s; /* 鼠标悬停时的过渡效果 */}
.card img {    width: 100%; /* 图片占满卡片宽度 */    height: auto;    border-radius: 8px 8px 0 0; /* 图片顶部圆角 */}
.card h2 {    font-size: 1.5rem;    color: #6d4c41; /* 棕色字体 */    margin-top: 15px;}
.card p {    font-size: 1rem;    color: #333;    line-height: 1.6;    margin-bottom: 15px;}
.card a {    text-decoration: none;    color: #6d4c41; /* 链接颜色 */    font-weight: bold;}
.card:hover {    transform: translateY(-5px); /* 鼠标悬停时卡片上移效果 */    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 添加阴影 */}


/* Travel的内容容器 */
.content-container {    display: flex; /* 使用 Flexbox 实现左右布局 */    justify-content: space-between;    align-items: center;
    max-width: 1200px; /* 最大宽度 */    margin: 0 auto; /* 居中对齐 */    gap: 30px; /* 两边的间距 */}
/* 左侧文本部分 */.text-section {    flex: 1; /* 占据一半宽度 */    max-width: 600px;}
.text-section h1 {    font-size: 3rem;    color: #6d4c41; /* 棕色字体 */    border-bottom: 2px solid #6d4c41;    padding-bottom: 10px;    margin-bottom: 20px;}
.text-section p {    font-size: 1.2rem;    line-height: 1.8;    color: #333;    margin-bottom: 30px;}
/* 按钮部分 */.buttons {    display: flex;    gap: 20px; /* 按钮之间的间距 */}
/* 右侧图片部分 */.image-section {    flex: 1; /* 占据一半宽度 */    max-width: 600px;}
.image-section img {    width: 100%; /* 图片宽度占满容器 */    height: auto;    border-radius: 10px; /* 圆角效果 */}


/* Emotion的外层容器 */
.content-container {    display: flex;    justify-content: space-between;    align-items: center;    padding: 50px;    max-width: 1200px;    margin: 0 auto;    background-color: #f9f7eb;}
/* 左侧图片样式 */.image-container {    flex: 1; /* 占据 50% 宽度 */    margin-right: 20px;}
.image-container img {    width: 100%;    border-radius: 10px; /* 图片圆角 */}
/* 右侧文字内容 */.text-container {    flex: 1.5; /* 占据更大的空间 */}
.text-container h2 {    font-size: 2.5rem;    color: #7b4b2a; /* 标题颜色 */    margin-bottom: 20px;}
.text-container p {    font-size: 1rem;    line-height: 1.6;    color: #5e3a28; /* 文字颜色 */    margin-bottom: 30px;}
/* 按钮样式 */.button-container {    display: flex;    gap: 15px; /* 按钮间的间距 */}
.btn {    text-decoration: none;    padding: 10px 20px;    font-size: 1rem;    border-radius: 5px;    transition: background-color 0.3s;}
.contact-btn {    background-color: #3a3a3a;    color: white;}
.learn-btn {    background-color: transparent;    color: #3a3a3a;    border: 1px solid #3a3a3a;}
.contact-btn:hover, .learn-btn:hover {    background-color: #2a2a2a;    color: white;}



/* blog跟mail外层容器 */.content-section {    display:flex;    justify-content: space-between;    align-items: flex-start;    max-width: 1200px;    padding: 50px;    margin: 0 auto;    gap: 20px;}
/* 每个卡片的基础样式 */.card {    flex:1;    min-width: 300px;     padding: 30px;}
/* Blog 部分样式 */.blog-card {    background-color: #4a4a4a; /* 深色背景 */    color: white; /* 白色字体 */}
.blog-card .btn {    display: inline-block;    margin-top: 20px;    padding: 10px 20px;    background-color: transparent;    border: 1px solid white;    color: white;    text-decoration: none;}
.blog-card .btn:hover {    background-color: white;    color: #4a4a4a;}
/* Contact 部分样式 */.contact-card {    background-color: #e5d6c2; /* 浅色背景 */    color: #5e3a28; /* 棕色字体 */}
.contact-card a {    color: #4a4a4a; /* 邮件链接颜色 */    text-decoration: none;}
.contact-card a:hover {    text-decoration: underline;}
/* 标题样式 */h2 {    font-size: 1.8rem;    margin-bottom: 15px;}
/* 段落样式 */p {    font-size: 1rem;    line-height: 1.6;}


/* Home About Services Contact */.nav-menu {    display: flex;    justify-content: center;/* 水平居中 */    list-style: none; /* 移除默认的圆点 */    padding: 0;    margin: 0;     gap: 20px; /* 设定每个导航项之间的间距 */}
/* 链接样式 */.nav-menu li a {text-decoration: none;    font-size: 1rem;    color: #4a4a4a;}
/* 鼠标悬停时变色 */.nav-menu li a:hover {color: #007BFF;}


/* Footer 基础样式 */footer {    background-color: #333; /* 背景颜色 */    color: white; /* 文字颜色 */    padding: 1px 0; /* 上下内边距 */    text-align: center; /* 居中对齐 */}