.memories-section{padding:95px 0 50px;overflow:hidden;background:#141711;scroll-margin-top:95px;border-top:1px solid #ffffff0c}
.memories-heading{width:min(1280px,88%);margin:auto;display:flex;direction:ltr;align-items:flex-end;justify-content:space-between;gap:30px}
.memory-eyebrow{font:10px var(--body);letter-spacing:3px;color:#b7bbad}
.memories-heading h2{font:clamp(32px,4.4vw,64px)/1.07 var(--display);margin:25px 0 0;color:#e9e8de;letter-spacing:-.6px}.memories-heading h2 em{font-style:normal;color:#ff7828}
.memories-intro{direction:rtl;padding-bottom:4px}.memories-intro p{font:14px/1.9 var(--body);color:#a4ac99;margin:0 0 20px}
.memories-toggle{display:flex;align-items:center;gap:10px;border:0;background:transparent;color:#c3c7b8;padding:0;font:11px var(--body)}.memories-toggle>span:first-child{display:grid;place-items:center;border:1px solid #ffffff30;width:33px;height:33px;border-radius:50%;color:#ff7828;font:12px var(--body)}
.memory-window{overflow:hidden;padding:65px 0 55px;mask-image:linear-gradient(90deg,transparent,#000 5% 95%,transparent)}
.memory-track{display:flex;width:max-content;animation:memory-drift 46s linear infinite;will-change:transform}
.memory-group{display:flex;align-items:center;gap:36px;padding-right:36px;flex-shrink:0}
.memory-frame{width:310px;padding:12px 12px 0;flex-shrink:0;margin:0;background:#d7d8c9;box-shadow:0 15px 28px #0005;transform:rotate(-4deg);transform-origin:center;border:1px solid #f5f1dc;transition:box-shadow .35s,border-color .35s}
.memory-frame:nth-child(2n){transform:rotate(3deg) translateY(10px);background:#c7cbbb}.memory-frame:nth-child(3n){transform:rotate(-2deg) translateY(-6px);background:#e4dfca}
.memory-photo{height:275px;position:relative;overflow:hidden;display:grid;place-items:center;background:radial-gradient(ellipse at center,#66381740,transparent 70%),repeating-linear-gradient(0deg,transparent 0 37px,#ffffff04 38px),#121811}
.memory-photo>img{width:100%;height:100%;object-fit:cover;opacity:.9;filter:saturate(.8) contrast(1.05);transition:transform 1.1s cubic-bezier(.2,.7,.2,1),filter .45s}
.memory-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#08100d4d,transparent 35%,#070b087a);pointer-events:none}
.memory-stamp{position:absolute;top:17px;left:17px;z-index:2;padding:5px 7px;background:#0b100dc9;border-left:2px solid #ff7828;font:7px var(--body);letter-spacing:1.5px;color:#e5e4d7}.memory-soon{position:absolute;bottom:19px;left:0;right:0;text-align:center;font:6px var(--body);letter-spacing:2px;color:#939a83}
.memory-frame figcaption{height:68px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 9px;color:#252d20}.memory-frame figcaption>span{font:600 17px var(--body)}.memory-frame figcaption small{font:7px var(--body);letter-spacing:1px;color:#636b57}
.memories-section.is-paused .memory-track,.memories-section.is-offscreen .memory-track{animation-play-state:paused}
/* Only the picture changes on hover; the clickable frame never moves beneath the pointer. */
@media(hover:hover){.memory-window:has(.memory-open-button:hover) .memory-track{animation-play-state:paused}.memory-frame:hover{border-color:#ffbd82;box-shadow:0 15px 28px #0005,0 0 24px #ff782827}.memory-frame:hover .memory-photo>img{transform:scale(1.045);filter:saturate(1) contrast(1.04)}}
.memories-bottom{width:88%;margin:0 auto;display:flex;justify-content:space-between;gap:20px;font:8px var(--body);letter-spacing:2px;color:#7f8976;border-top:1px solid #ffffff14;padding-top:25px}
main section[tabindex="-1"]:focus{outline:none}
@keyframes memory-drift{to{transform:translateX(-50%)}}
/* The system pointer stays visible; this canvas is only the trailing accent. */
.cursor-trail{position:fixed;inset:0;width:100%;height:100%;pointer-events:none!important;z-index:2147483646}
html{scrollbar-width:thin;scrollbar-color:#ff7828 transparent}
::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ff7828;border-radius:20px}::-webkit-scrollbar-button{display:none}
html.custom-scrollbar{scrollbar-width:none}html.custom-scrollbar::-webkit-scrollbar{display:none}
.page-scrollbar{position:fixed;right:2px;top:10px;bottom:10px;width:9px;background:transparent;z-index:9998;touch-action:none;opacity:.8;transition:opacity .2s;outline:none;direction:ltr}
.page-scrollbar:hover,.page-scrollbar:focus-visible{opacity:1}.page-scrollbar:focus-visible .page-scroll-thumb{outline:1px solid #ffba74;outline-offset:2px}
.page-scroll-thumb{position:absolute;top:0;right:1px;width:4px;height:48px;border-radius:8px;background:#ff7828;box-shadow:0 0 9px #ff782832;pointer-events:none}
body.intro-active .page-scrollbar,body.menu-open .page-scrollbar,body.story-open .page-scrollbar{visibility:hidden}
@media(max-width:700px){.memories-section{padding-top:70px}.memories-heading{display:block}.memories-heading h2{font-size:36px}.memories-intro{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:26px}.memories-intro p{font-size:12px;margin:0}.memory-frame{width:240px;padding:9px 9px 0}.memory-photo{height:224px}.memory-group{gap:27px;padding-right:27px}.memory-frame figcaption{height:60px;padding:0 5px}.memory-frame figcaption>span{font-size:14px}.memory-frame figcaption small{font-size:6px}.memory-window{padding:50px 0}.memories-bottom{font-size:6px;letter-spacing:1px}.memories-toggle-label{display:none}}
@media(pointer:coarse),(prefers-reduced-motion:reduce){.cursor-trail{display:none}}
@media(prefers-reduced-motion:reduce){.memory-track{animation:none}.memory-window{overflow-x:auto;mask-image:none}.memory-frame{transition:none}.memories-toggle{display:none}}
