.story-detail{position:sticky;grid-column:2;grid-row:1;top:15svh;z-index:12;width:100%;height:70svh;overflow:hidden;border-radius:clamp(24px,2.3vw,40px);align-self:start;color:#fffaf2;background:linear-gradient(120deg,rgba(10,29,22,.91),rgba(17,52,40,.78));clip-path:circle(0 at calc(100% - 30px) 30px);visibility:hidden;pointer-events:none;will-change:clip-path;transform:translateZ(0);transition:clip-path .78s cubic-bezier(.77,0,.18,1),visibility 0s .8s;isolation:isolate}
.story-detail.is-open{clip-path:circle(150vmax at calc(100% - 30px) 30px);visibility:visible;pointer-events:auto;transition:clip-path .88s cubic-bezier(.77,0,.18,1),visibility 0s}
.story-detail__copy{position:relative;z-index:2;display:flex;height:100%;flex-direction:column;align-items:flex-start;padding:clamp(36px,4.2vw,66px);opacity:0;transition:opacity .22s ease}.story-detail.is-open .story-detail__copy{opacity:1;transition-delay:.42s}
.story-detail__copy h3{margin:0;font:400 clamp(27px,2.6vw,39px)/1.05 var(--serif),Georgia,serif;letter-spacing:-.035em}.story-detail__body{max-width:700px;margin-top:27px}.story-detail__body p{margin:0 0 15px;color:rgba(255,250,242,.8);font:400 clamp(14px,1.05vw,17px)/1.62 var(--sans),Arial,sans-serif}
.story-detail__actions{display:flex;flex-wrap:wrap;gap:18px 30px;margin-top:auto}.story-detail__actions a{display:inline-flex;align-items:center;gap:12px;padding-bottom:8px;border-bottom:1px solid currentColor;color:#fffaf2;font:750 12px/1 var(--sans),Arial,sans-serif;text-decoration:none}.story-detail__actions a span{transition:transform .25s ease}.story-detail__actions a:hover span{transform:translateX(5px)}
.story-detail__close{position:absolute;z-index:3;top:22px;right:24px;display:flex;align-items:center;gap:11px;padding:8px;border:0;background:transparent;color:#fffaf2;font:650 11px var(--sans),Arial,sans-serif;opacity:0;cursor:pointer;transition:opacity .2s ease}.story-detail.is-open .story-detail__close{opacity:1;transition-delay:.42s}.story-detail__close i{position:relative;width:23px;height:23px;transition:transform .45s cubic-bezier(.2,.8,.2,1)}.story-detail__close i:before,.story-detail__close i:after{content:"";position:absolute;top:11px;left:2px;width:20px;height:1px;background:currentColor;transform:rotate(45deg)}.story-detail__close i:after{transform:rotate(-45deg)}.story-detail__close:hover i{transform:rotate(90deg)}
.story__read-more{border-top:0;border-right:0;border-left:0;background:transparent;cursor:pointer;text-align:left}.story__read-more:focus-visible,.story-detail a:focus-visible,.story-detail__close:focus-visible{outline:3px solid #d8c18f;outline-offset:6px}
@media(max-width:1050px) and (min-width:651px){.story-detail{top:18svh;height:64svh}.story-detail__copy{padding:50px 34px 34px}.story-detail__body{margin-top:20px}}
@media(max-width:650px){.story-detail{position:fixed;z-index:80;inset:max(12px,env(safe-area-inset-top)) 12px auto;width:auto;height:calc(100dvh - 24px);max-height:calc(100dvh - 24px);min-height:0;align-self:auto;border-radius:24px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:linear-gradient(145deg,rgba(6,24,17,.96),rgba(9,38,28,.93));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 24px 80px rgba(3,18,13,.34)}.story-detail__copy{height:auto;min-height:100%;padding:72px 22px 28px}.story-detail__copy h3{font-size:29px;line-height:1.08}.story-detail__body{max-width:none;margin-top:22px;overflow:visible}.story-detail__body p{font-size:14px;line-height:1.58;margin-bottom:14px}.story-detail__actions{gap:14px 22px;margin-top:auto;padding-top:24px}.story-detail__actions a{min-height:38px}.story-detail__close{position:fixed;top:max(22px,calc(env(safe-area-inset-top) + 10px));right:22px}.mobile-overlay-open{overflow:hidden}}
@media(prefers-reduced-motion:reduce){.story-detail,.story-detail__copy,.story-detail__close,.story-detail__close i{transition:none}}
