.moments-section{position:relative;overflow:hidden;padding:118px 0 126px;background:#f4f5ef;color:#183a36}
.moments-section::before{content:"MOMENTS";position:absolute;right:-.04em;top:28px;font-family:Georgia,"Noto Serif TC",serif;font-size:clamp(5rem,14vw,13rem);font-style:italic;line-height:1;color:rgba(20,64,58,.035);pointer-events:none}
.moments-shell{position:relative;z-index:1}
.moments-head{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(300px,.58fr);gap:9vw;align-items:end;margin-bottom:58px}
.moments-head h2{margin:14px 0 0;font-family:"Noto Serif TC",serif;font-size:clamp(2.55rem,5vw,5.1rem);font-weight:600;line-height:1.2;letter-spacing:-.045em}
.moments-head h2 em{color:#8dbb36;font-style:normal}
.moments-intro{padding:0 0 8px 26px;border-left:1px solid rgba(24,58,54,.2)}
.moments-intro span{display:block;margin-bottom:18px;color:#6c9231;font-size:.72rem;font-weight:700;letter-spacing:.16em}
.moments-intro p{margin:0;color:#536460;font-size:.98rem;line-height:1.95}
.moments-gallery{display:grid;grid-template-columns:1.45fr .92fr;grid-template-rows:repeat(2,minmax(255px,1fr));gap:18px;min-height:710px}
.moment-card{position:relative;overflow:hidden;background:#fff}
.moment-feature{grid-row:1/3}
.moment-placeholder{position:absolute;inset:0;overflow:hidden;background:#dfe8d7}
.moment-placeholder::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(13,42,38,.72) 100%)}
.moment-a .moment-placeholder{background:radial-gradient(circle at 25% 20%,rgba(255,255,255,.92),transparent 25%),linear-gradient(145deg,#cae097 0%,#8fbd43 42%,#387b68 100%)}
.moment-a .moment-placeholder::before{content:"";position:absolute;width:68%;aspect-ratio:1;border:1px solid rgba(255,255,255,.58);border-radius:50%;right:-22%;top:-10%;box-shadow:0 0 0 58px rgba(255,255,255,.06),0 0 0 116px rgba(255,255,255,.04)}
.moment-b .moment-placeholder{background:linear-gradient(145deg,#f1d86b,#e8c34f 48%,#c4d77e)}
.moment-b .moment-placeholder::before{content:"";position:absolute;inset:12% 9%;border:1px solid rgba(255,255,255,.72);transform:rotate(-5deg)}
.moment-c .moment-placeholder{background:linear-gradient(145deg,#cde2de,#71aaa3 50%,#317e78)}
.moment-c .moment-placeholder::before{content:"";position:absolute;width:48%;height:140%;left:15%;top:-18%;border-left:1px solid rgba(255,255,255,.55);border-right:1px solid rgba(255,255,255,.35);transform:rotate(26deg)}
.moment-mark{position:absolute;left:50%;top:42%;z-index:1;transform:translate(-50%,-50%);font-family:Georgia,serif;font-size:clamp(7rem,17vw,15rem);font-style:italic;color:rgba(255,255,255,.22);line-height:1}
.moment-orbit{position:absolute;left:50%;top:42%;z-index:1;width:145px;height:145px;transform:translate(-50%,-50%);border:1px solid rgba(255,255,255,.68);border-radius:50%;box-shadow:0 0 0 28px rgba(255,255,255,.1)}
.moment-orbit::after{content:"";position:absolute;width:14px;height:14px;right:7px;top:17px;border-radius:50%;background:#fff}
.moment-cross{position:absolute;left:50%;top:41%;z-index:1;transform:translate(-50%,-50%);color:rgba(255,255,255,.68);font-family:Georgia,serif;font-size:8rem;font-weight:200}
.moment-upload-note{position:absolute;left:50%;top:48%;z-index:2;transform:translate(-50%,-50%);padding:8px 13px;border:1px solid rgba(255,255,255,.7);color:#fff;font-size:.62rem;font-weight:700;letter-spacing:.17em;white-space:nowrap}
.moment-caption{position:absolute;z-index:3;left:0;right:0;bottom:0;display:flex;gap:18px;align-items:flex-end;padding:28px 30px;color:#fff}
.moment-feature .moment-caption{padding:38px 40px}
.moment-caption>span{padding-bottom:3px;color:#e9dc78;font-family:Georgia,serif;font-size:.9rem;font-style:italic}
.moment-caption b,.moment-caption small{display:block}
.moment-caption b{font-family:"Noto Serif TC",serif;font-size:1.16rem;font-weight:600;letter-spacing:.04em}
.moment-feature .moment-caption b{font-size:1.45rem}
.moment-caption small{margin-top:8px;color:rgba(255,255,255,.72);font-size:.72rem;letter-spacing:.12em}
.moments-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-top:42px;padding-top:28px;border-top:1px solid rgba(24,58,54,.16)}
.moments-foot p{margin:0;font-family:"Noto Serif TC",serif;font-size:1.04rem;line-height:1.75;letter-spacing:.04em}
.moments-foot a{display:inline-flex;gap:22px;align-items:center;padding-bottom:8px;border-bottom:1px solid #183a36;color:#183a36;font-size:.82rem;font-weight:700;letter-spacing:.1em;text-decoration:none}
.moments-foot a span{color:#8dbb36;font-size:1.05rem}
@media (max-width:800px){
 .moments-section{padding:82px 0 88px}
 .moments-head{grid-template-columns:1fr;gap:30px;margin-bottom:38px}
 .moments-head h2{font-size:clamp(2.3rem,11vw,3.7rem)}
 .moments-intro{padding:0 0 0 18px}
 .moments-gallery{display:flex;gap:14px;min-height:0;margin-right:calc((100vw - 100%)/-2);padding-right:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
 .moments-gallery::-webkit-scrollbar{display:none}
 .moment-card,.moment-feature{flex:0 0 min(82vw,430px);height:520px;grid-row:auto;scroll-snap-align:start}
 .moment-card:not(.moment-feature){height:430px;margin-top:44px}
 .moment-caption,.moment-feature .moment-caption{padding:26px 24px}
 .moment-caption b,.moment-feature .moment-caption b{font-size:1.08rem}
 .moments-foot{align-items:flex-start;flex-direction:column;margin-top:34px}
}