/* === Css/Main.css (最終修正版) === */
html, body {
    width: 100%;
    height: 100%;
    overflow-x: hidden; /* 關鍵：禁止水平滾動 */
    margin: 0;
    padding: 0;
}

/* 2. 為所有元素設定 border-box 模型 */
/* 這可以從根本上避免 padding 撐開寬度的問題 */
* {
    box-sizing: border-box;
}

/* 3. 確保圖片不會超出其容器的寬度 */
img {
    max-width: 100%;
    height: auto; /* 保持圖片的長寬比 */
}
/* === 4個頁面都一樣且統一的樣式寫這邊 === */
body {
    cursor: url("../Image/cursor/666666.png") , auto;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    /* 為整個頁面設定一個基礎背景色 */
    background-color: #f0f2f5; 
    
    
   
}
/* .webIcon{
    width: 64px;
    height: 64px;
} */



/* ▼▼▼ 這是本次最重要的修改 ▼▼▼ */
/* 讓包裹所有 section 的容器也變成透明的 */
.section-scroll-container {
    background-color: transparent;
}
/* ▲▲▲ 修改結束 ▲▲▲ */
@media (min-width: 1024px) {

    /* === 頁面滑動 === */
    html, body {
        scroll-snap-type: y mandatory;
        scroll-behavior: smooth;
        /* position: absolute; */
    }

    section {
        height: 100vh;
        scroll-snap-align: start;
        /* 讓所有 section 的背景都變成透明，才能看到後面的粒子 */
        background-color: transparent;
        scroll-margin-top: var(--header-height, 80px);
    }
    
}
@media (max-width: 767px) {
    section {
        height: auto;
        /* border:solid 5px rgb(217, 178, 72); */
       
    }
  
    body{
        width: 100%;
        height: auto;   
        /* border:solid 5px rgb(217, 89, 72); */
    }
 
}


:root {
  --header-height: 65px; /* 改成你實際 header 高度 */
}

h1 {
    display: flex;
    justify-content: center; 
    align-items: center;  
}

body:active{
    cursor: url("../Image/cursor/確認2.png") 0 0, auto;
}

span:hover{
    cursor: url("../Image/cursor/輸入(小).png") 0 0, auto;
}
a:hover{
    cursor: url("../Image/cursor/點選2.png") 0 0, auto;
}

