/* General layout */
.main-layout {
    display: flex;
    height: 100vh; /* Full height */
    width: 100%;
    overflow: hidden;
}

/* Content layout */
.content-about-page {
    display: grid;
    grid-template-columns: 1fr 2fr; /* 左 1/3，右 2/3 */
    gap: 50px; /* 左右間隔 */
    padding: 50px;
    box-sizing: border-box;
    width: 100%;
    align-items: stretch; /* 左右等高 */
    overflow-y: auto; /* 垂直滾動條 */
    overflow-x: hidden; /* 禁止水平滾動 */
}

/* About photo */
.about-photo img {
    width: 100%; /* 圖片寬度占滿左欄 */
    height: 100%; /* 圖片高度與右欄對齊 */
    object-fit: cover; /* 確保圖片比例 */
}

/* About text */
.about-text {
    display: flex;
    flex-direction: column; /* 垂直排列 */
    justify-content: space-between; /* 第一段靠上，結尾句靠下 */
}

/* About title */
.about-text h1 {
    font-size: 28px;
    font-family: "Blinker", sans-serif;
    font-weight: 600; /* semibold */
    margin-bottom: 36px; /* 與敘述文字的間距 */
    text-align: start;
}

/* Description text */
.description {
    font-size: 16px;
    font-family: "Blinker", sans-serif;
    line-height: 1.6; /* 增加段落行高 */
    text-align: start;
    margin-bottom: 16px; /* 每段之間的間距 */
}

/* 移除最後一段的間距 */
.description:last-of-type {
    margin-bottom: 0;
}

/* Closing line */
.closing-line {
    font-size: 16px;
    font-family: "Blinker", sans-serif;
    text-align: start;
    margin-top: auto; /* 推到下方 */
}

@media (max-width: 768px) {
    .content-about-page {
        grid-template-columns: 1fr; /* 單欄布局 */
        gap: 30px;
    }

    .about-photo img {
        height: auto; /* 圖片高度自適應 */
    }
}