@font-face{font-display:swap;font-family:Noto Sans TC;font-style:normal;font-weight:400;src:local("Noto Sans TC Regular"),local("NotoSansTC-Regular"),url(fonts/noto-sans-tc-400.woff2) format("woff2")}:root{--primary-color:#a63434;--primary-light:#bb5353;--primary-dark:#863030;--secondary-color:#3e3e3e;--bg-color:#f7f5f0;--card-bg:#fff;--text-color:#2c2c2c}*{box-sizing:border-box}*,body,html{margin:0;padding:0}body,html{max-width:100%;overflow-x:hidden;position:relative;touch-action:pan-y;width:100%}body{background-color:var(--bg-color);color:var(--text-color);font-display:swap;font-family:Noto Sans TC,sans-serif;letter-spacing:.05rem;line-height:1.6;padding-top:70px}h2{color:var(--secondary-color);margin-bottom:15px}a:link{color:blue}a:visited{color:purple}a:hover{color:red}.navbar{align-items:center;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background-color:hsla(0,0%,100%,.85);box-shadow:0 2px 10px rgba(0,0,0,.1);display:flex;justify-content:space-between;left:0;padding:1rem 5%;position:fixed;top:0;transition:all .3s ease;width:100%;z-index:1000}.logo{color:var(--primary-color);font-size:1.5rem;font-weight:700}.nav-links{display:flex;gap:20px;list-style:none}.nav-links a{color:var(--secondary-color);font-weight:500;position:relative;text-decoration:none;transition:color .3s}.nav-links a:after{background:var(--primary-light);bottom:-5px;content:"";height:2px;left:50%;position:absolute;transform:translateX(-50%);transition:all .3s ease;width:0}.nav-links a.active:after,.nav-links a:hover:after{width:100%}.nav-links a.active,.nav-links a:hover{color:var(--primary-color)}.page-section{animation:a .5s ease;display:none;opacity:0;padding-bottom:50px;transform:translateY(20px);transition:opacity .4s ease,transform .4s ease}.page-section.active-section{display:block;opacity:1;transform:translateY(0)}.hero{background:linear-gradient(180deg,#fff 0,hsla(0,0%,100%,.8) 80%,hsla(0,0%,100%,0));margin-bottom:20px;padding:120px 20px 80px;position:relative;text-align:center}.hero h1{color:var(--primary-color);font-size:2.5rem;margin-bottom:10px}.hero:after{background:radial-gradient(circle,rgba(166,52,52,.3) 0,transparent 70%);bottom:0;content:"";height:1px;left:10%;position:absolute;width:80%}.full-text{display:none}.timeline-container{margin:0 auto;max-width:1000px;padding:20px 0;position:relative}.timeline-container:after{background:linear-gradient(to bottom,transparent 0,var(--primary-color) 5%,var(--primary-color) 95%,transparent 100%);bottom:0;content:"";left:50%;margin-left:-2px;position:absolute;top:0;width:4px;z-index:0}.timeline-item{align-items:center;display:flex;justify-content:space-between;margin-bottom:60px;opacity:0;position:relative;transform:translate3d(0,30px,0);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1);width:100%;will-change:transform,opacity}.timeline-item.is-visible,.timeline-item.show{opacity:1;transform:translateZ(0)}.timeline-item:nth-child(odd){flex-direction:row}.timeline-item:nth-child(odd) .timeline-content{text-align:right}.timeline-item:nth-child(2n) .timeline-content,.timeline-item:nth-child(odd) .thoughts{text-align:left}.timeline-item:nth-child(2n){flex-direction:row-reverse}.timeline-content,.timeline-img{position:relative;width:45%;z-index:1}.timeline-img:before{border:2px solid var(--primary-color);border-radius:8px;content:"";height:100%;left:15px;opacity:.3;position:absolute;top:15px;transition:all .4s ease;width:100%;z-index:-1}.timeline-img:has(img:hover):before{opacity:.6;transform:translate(-10px,-10px)}.timeline-item:after{animation:c 2s infinite;background-color:#fff;background-color:var(--primary-color);border:4px solid #fff;border-radius:50%;content:"";height:20px;left:50%;outline:4px solid var(--primary-color);position:absolute;top:50%;transform:translate(-50%,-50%);width:20px;z-index:2}.timeline-content{background:#fff;border-radius:8px;box-shadow:0 4px 15px rgba(0,0,0,.1);cursor:pointer;padding:25px;transition:all .3s ease}.timeline-content h2{display:block;font-size:1.5rem;line-height:1.4;min-height:1.8em;word-break:break-word}.timeline-content:hover{box-shadow:0 10px 25px rgba(0,0,0,.15);transform:translateY(-8px)}.timeline-content:hover h2{color:var(--primary-color);transition:color .3s ease}.date{background:var(--primary-color);border-radius:4px;clip-path:polygon(0 0,95% 0,100% 50%,95% 100%,0 100%);color:#fff;display:inline-block;font-size:.9rem;margin-bottom:10px;padding:5px 20px 5px 10px}.thoughts{background-color:#f1f1f1;border-left:4px solid #888;font-size:.95rem;font-style:normal;margin-top:15px;padding:10px}.thoughts p{margin-bottom:1.5rem}.thoughts p:last-child{margin-bottom:0}.timeline-img img{aspect-ratio:3/2;backface-visibility:hidden;border:1px solid rgba(0,0,0,.05);border-radius:8px;box-shadow:0 4px 10px rgba(0,0,0,.15);display:block;height:auto;object-fit:cover;transition:transform .3s;width:100%}.timeline-img img:hover{box-shadow:0 10px 20px rgba(0,0,0,.1);transform:translateY(-5px) scale(1.02)}.education-content{display:grid;gap:30px;margin:0 auto;max-width:800px;padding:20px}.card{background:#fff;border-radius:10px;box-shadow:0 4px 15px rgba(0,0,0,.05);padding:30px;transition:transform .3s ease,box-shadow .3s ease}.card img{border-radius:5px;display:block;height:auto;margin-top:15px;width:100%}.card:hover{box-shadow:0 12px 30px rgba(183,62,62,.1);transform:translateY(-8px)}.gallery-container{margin:0 auto;max-width:1200px;padding:0 20px}.gallery-grid{display:grid;gap:25px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.gallery-item{aspect-ratio:4/3;border-radius:10px;box-shadow:0 5px 15px rgba(0,0,0,.1);cursor:pointer;overflow:hidden;position:relative}.gallery-item img{display:block;height:100%;object-fit:cover;transition:transform .4s cubic-bezier(.2,.8,.2,1);width:100%}.gallery-item .caption{background:linear-gradient(0deg,rgba(0,0,0,.8) 0,transparent);bottom:0;color:#fff;left:0;opacity:0;padding:40px 20px 20px;position:absolute;right:0;transform:translateY(20px);transition:opacity .4s ease,transform .4s ease}.gallery-item:hover img{transform:scale(1.05)}.gallery-item:hover .caption{opacity:1;transform:translateY(0)}.caption h3{font-size:1.2rem;margin:0 0 5px}.caption p{font-size:.9rem;margin:0}.gallery-subtitle{border-bottom:3px solid var(--primary-color);color:var(--primary-dark);display:block;font-size:1.6rem;grid-column:1/-1;letter-spacing:.1rem;margin:40px 0 20px;padding-bottom:8px}.gallery-grid .gallery-subtitle:first-child{margin-top:10px}.modal{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background-color:rgba(0,0,0,.6);display:none;height:100%;left:0;position:fixed;top:0;width:100%;z-index:2000}.modal-content{animation:b .4s cubic-bezier(.165,.84,.44,1);background-color:var(--bg-color);border-radius:30px;box-shadow:0 25px 50px rgba(0,0,0,.3);height:96vh;margin:2vh auto;overflow-y:auto;padding:60px 40px;position:relative;width:95vw}.modal-full-text p{color:var(--text-color);display:block!important;line-height:1.8;margin-bottom:1.5rem;text-indent:2em}.modal-full-text p:last-child{margin-bottom:0}#modal-title{border-bottom:2px solid var(--primary-color);color:var(--primary-color);display:inline-block;font-size:2.2rem;margin-bottom:30px;padding-bottom:10px}#modal-body{color:var(--text-color);font-size:1.1rem;line-height:1.8}.close-btn{background-color:var(--primary-color);border:2px solid var(--primary-color);border-radius:50%;box-shadow:0 4px 15px rgba(0,0,0,.2);cursor:pointer;height:50px;position:fixed;right:25px;top:25px;transition:background-color .4s ease,transform .5s cubic-bezier(.4,0,.2,1),box-shadow .3s ease;width:50px;z-index:3100}.close-btn:after,.close-btn:before{background-color:#fff;border-radius:2px;content:"";height:3px;left:50%;position:absolute;top:50%;transition:background-color .4s ease;width:24px}.close-btn:before{transform:translate(-50%,-50%) rotate(45deg)}.close-btn:after{transform:translate(-50%,-50%) rotate(-45deg)}.close-btn:hover{background-color:#fff;box-shadow:0 6px 20px rgba(166,52,52,.3);transform:rotate(180deg)}.close-btn:hover:after,.close-btn:hover:before{background-color:var(--primary-color)}.image-modal{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background-color:hsla(0,0%,100%,.85);display:none;height:100%;left:0;opacity:0;overflow:auto;position:fixed;top:0;transition:opacity .3s ease;width:100%;z-index:3000}.image-modal.visible{opacity:1}.image-content-wrapper{align-items:center;display:flex;height:100%;justify-content:center;width:100%}#image-modal{display:none;height:100%;left:0;overflow:hidden;position:fixed;top:0;z-index:2000}#image-modal,.image-zoom-container{background-color:hsla(0,0%,100%,.85);width:100%}.image-zoom-container{align-items:center;display:flex;flex:1;justify-content:center;margin:0;overflow:auto;padding:0}.image-modal-content{display:block;max-height:85vh;max-width:90%;transition:transform .3s ease-out;will-change:transform}.image-modal-content.zoomed{cursor:zoom-out;max-height:none;max-width:none;transform:scale(2)}#image-modal .close-btn{color:#fff;cursor:pointer;font-size:40px;position:absolute;right:30px;top:20px;z-index:2001}.modal-caption{background:#000;border-top:1px solid #222;color:#ccc;font-size:1rem;padding:15px 0;text-align:center;width:100%}#modal-img-caption{background:rgba(0,0,0,.6);border-radius:6px;color:#fff;font-size:1.1rem;left:25px;opacity:0;padding:8px 15px;pointer-events:none;position:fixed;top:25px;transform:translateY(-20px);transition:opacity .4s ease,transform .4s ease;z-index:3001}.image-modal.visible #modal-img-caption{opacity:1;transform:translateY(0)}.image-zoom-container::-webkit-scrollbar{height:8px;width:8px}.image-zoom-container::-webkit-scrollbar-track{background:#f1f1f1}.image-zoom-container::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:10px}.image-zoom-container::-webkit-scrollbar-thumb:hover{background:#963232}.faq-card{margin-top:2rem}.faq-container{margin-top:1.5rem}.faq-item{border-bottom:1px solid rgba(166,52,52,.1);transition:background-color .3s ease}.faq-item:last-child{border-bottom:none}.faq-item summary{color:var(--secondary-color);cursor:pointer;display:list-item;font-weight:700;list-style:disclosure-closed;outline:none;padding:1.2rem 1rem;transition:color .3s ease}.faq-item summary:hover,.faq-item[open] summary{color:var(--primary-color)}.faq-item[open] summary{list-style:disclosure-open}.faq-content{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows .4s cubic-bezier(.4,0,.2,1)}.faq-item[open] .faq-content,.faq-item[open]+.faq-content{grid-template-rows:1fr}.faq-answer{min-height:0;transition:visibility .4s;visibility:hidden}.faq-item[open] .faq-answer{padding:0 1rem 1.5rem 2.2rem;visibility:visible}.faq-answer p{color:var(--text-color);font-size:.95rem;line-height:1.8;opacity:0;transform:translateY(-10px);transition:opacity .4s ease,transform .4s ease}.faq-item[open] .faq-answer p{opacity:1;transform:translateY(0)}@media (max-width:768px){.faq-item summary{font-size:1rem;padding:1rem .5rem}}footer{background-color:#333;color:#fff;margin-top:50px;padding:20px;text-align:center}@keyframes a{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes b{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes c{0%{box-shadow:0 0 0 0 rgba(183,62,62,.4)}70%{box-shadow:0 0 0 15px rgba(183,62,62,0)}to{box-shadow:0 0 0 0 rgba(183,62,62,0)}}.menu-toggle{cursor:pointer;display:none;flex-direction:column;gap:5px;position:relative;z-index:1001}.menu-toggle .bar{background-color:var(--primary-color);height:3px;transition:all .3s ease;width:25px}.menu-overlay{backdrop-filter:blur(4px);background:rgba(0,0,0,.5);height:100%;left:0;opacity:0;position:fixed;top:0;transition:opacity .3s ease;visibility:hidden;width:100%;z-index:998}.menu-overlay.active{opacity:1;visibility:visible}.audio-btn{align-items:center;background:var(--primary-color);border:none;border-radius:50px;color:#fff;cursor:pointer;display:flex;font-family:inherit;gap:8px;padding:8px 16px;transition:background .3s ease}.audio-btn:hover{background:var(--primary-dark);box-shadow:0 5px 15px rgba(187,83,83,.4);transform:translateY(-2px)}.audio-btn svg{display:block}#audio-icon-container{align-items:center;display:flex;justify-content:center}.methods-grid{display:grid;gap:40px;grid-template-columns:repeat(2,1fr);margin:40px auto;max-width:1000px;padding:0 30px}.method-card{align-items:center;border:1px solid rgba(166,52,52,.1);display:flex;flex-direction:column;overflow:hidden;padding:40px 30px;position:relative;text-align:center}.method-tag{background:var(--primary-color);border-bottom-right-radius:10px;color:#fff;font-size:.75rem;left:0;padding:4px 12px;position:absolute;top:0}.method-icon{filter:drop-shadow(0 5px 10px rgba(0,0,0,.1));font-size:3.5rem;margin-bottom:20px}.method-card h3{border-bottom:2px solid var(--bg-color);color:var(--primary-dark);font-size:1.4rem;margin-bottom:15px;padding-bottom:10px}.method-card p{color:var(--secondary-color);font-size:.95rem;line-height:1.8}@media screen and (max-width:768px){.timeline-container:after{left:31px}.timeline-item{align-items:flex-start;flex-direction:column!important;padding-left:70px;padding-right:20px}.timeline-content,.timeline-img{text-align:left;width:100%}.timeline-img{margin-top:20px}.timeline-item:after{left:31px;top:25px;transform:translate(-50%)}.timeline-item:first-child{opacity:1!important;transform:translateY(0)!important}.menu-toggle{display:flex}.menu-toggle.is-active .bar:nth-child(2){opacity:0}.menu-toggle.is-active .bar:first-child{transform:translateY(8px) rotate(45deg)}.menu-toggle.is-active .bar:nth-child(3){transform:translateY(-8px) rotate(-45deg)}.nav-links{align-items:center;background-color:#fff;box-shadow:-5px 0 15px rgba(0,0,0,.1);display:flex;flex-direction:column;gap:10px;height:100vh;justify-content:flex-start;overflow-x:hidden;padding-top:80px;position:fixed;right:0;top:0;transform:translateX(100%);transition:transform .4s cubic-bezier(.4,0,.2,1),visibility .4s;visibility:hidden;width:250px;z-index:999}.nav-links.active{transform:translateX(0);visibility:visible}.nav-links li{padding:15px 0;text-align:center;width:100%}.methods-grid{gap:25px;grid-template-columns:1fr}}::selection{background-color:var(--primary-light);color:#fff}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#963232}