/* A paper archive in the shared homepage canvas, not another card component. */
.case-gateway { position: relative; isolation: isolate; overflow: clip; padding-block: 25px 32px; }
.case-gateway-inner { position: relative; min-height: clamp(430px, 34vw, 570px); display: flex; align-items: center; }
.case-gateway-copy { position: relative; z-index: 2; width: 48%; padding-block: 44px; pointer-events: none; }
.case-gateway-copy .eyebrow { color: #5a7d86; font-size: 10px; letter-spacing: .22em; margin-bottom: 23px; }
.case-gateway-copy h2 { font-family: inherit; font-size: clamp(34px, 3.9vw, 64px); font-weight: 500; line-height: 1.38; letter-spacing: -.055em; color: #17333f; margin: 0; }
.case-gateway-intro { color: #6a7e88; font-size: clamp(13px, 1.2vw, 17px); line-height: 1.9; margin-top: 19px; }
.case-gateway-link { display: inline-flex; align-items: center; gap: 22px; min-height: 48px; margin-top: 27px; color: #226b77; font-size: 16px; font-weight: 500; pointer-events: auto; }
.case-link-arrow { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #40838b; border-radius: 50%; transition: background .3s, color .3s, transform .4s; }
.case-link-arrow svg { width: 23px; height: 23px; transition: transform .35s; }
.case-gateway-link:hover .case-link-arrow { background: #226b77; color: white; transform: rotate(5deg); }
.case-gateway-link:hover svg { transform: translate(2px,-2px); }
.case-gateway-link:focus-visible, .case-motion-toggle:focus-visible { outline: 2px solid #226b77; outline-offset: 7px; border-radius: 2px; }
.case-routes { display: flex; gap: 19px; align-items: center; margin-top: 30px; font-size: 10px; letter-spacing: .2em; color: #617882; }
.case-routes span { color: #b3c6cc; }
.case-watermark { position: absolute; z-index: -1; right: 1%; top: 3%; color: #57778408; font: 170px/1 Georgia, serif; letter-spacing: -.07em; pointer-events: none; }
.case-art { position: absolute; width: 83%; right: -10%; top: 50%; transform: translateY(-50%); pointer-events: none; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%); mask-image: linear-gradient(90deg, transparent, #000 12%); }
.case-art-parallax { transform: translate3d(var(--case-pointer-x,0px),var(--case-scroll-y,0px),0); transition: transform 1s cubic-bezier(.2,.7,.3,1); }
.case-art-entrance { transform: translateY(var(--case-pointer-y,0px)); transition: transform 1s ease; }
.case-ribbon { display: block; width: 100%; max-width: none; height: auto; transform-origin: 70% 70%; animation: case-ribbon-drift 10s ease-in-out infinite alternate; animation-play-state: paused; }
.case-in-view:not(.case-motion-paused):not(.case-reduced-motion) .case-ribbon { animation-play-state: running; }
.case-motion-toggle { position: absolute; z-index: 3; right: 8px; bottom: 9px; align-items: center; gap: 8px; padding: 9px 4px; min-height: 40px; color: #718a92; font-size: 10px; letter-spacing: .04em; }
.case-motion-toggle:not([hidden]) { display: inline-flex; }
.case-pause-symbol { font-size: 13px; width: 15px; }
.case-motion-toggle:hover { color: #226b77; }
@keyframes case-ribbon-drift { from { transform: translate3d(0,5px,0) rotate(-.45deg); } to { transform: translate3d(-11px,-9px,0) rotate(.35deg); } }
:lang(en) .case-gateway-copy h2 { font-size: clamp(33px,3.3vw,55px); line-height: 1.2; letter-spacing: -.045em; }
:lang(en) .case-gateway-intro { max-width: 315px; }
.case-archive-page { position: relative; padding-block: 35px 70px; overflow: clip; }
.case-back { display: inline-block; font-size: 13px; color: #63838e; margin-bottom: 54px; padding-block: 10px; }
.case-archive-page>.eyebrow { margin-bottom: 14px; }
.case-archive-page>h1 { font-size: clamp(42px,5vw,72px); font-family: inherit; font-weight: 500; color: #203d49; }
.case-page-intro { font-size: 17px; margin-top: 19px; color: #6a7e88; }
.case-page-art { width: min(1000px,85%); margin: 10px 0 0 auto; }
.case-page-art img { display: block; width: 100%; height: auto; }
.case-archive-pending { border-top: 1px solid #dce5e8; padding-block: 35px; }
.case-archive-pending h2 { font-size: 25px; font-family: inherit; margin-top: 10px; }
.case-archive-pending>p:not(.eyebrow) { max-width: 680px; color: #6a7e88; font-size: 14px; line-height: 1.9; margin-top: 16px; }
.case-page-note { color: #8b9da4; font-size: 11px; line-height: 1.8; }
@media(min-width:701px) and (max-width:1050px) {
  .case-gateway-inner { min-height: 415px; }
  .case-gateway-copy { width: 52%; }
  .case-art { width: 89%; right: -20%; }
  .case-gateway-copy h2 { font-size: 37px; }
  .case-watermark { font-size: 130px; }
}
@media(max-width:700px) {
  .case-gateway { padding-block: 25px 12px; }
  .case-gateway-inner { display: flex; flex-direction: column; align-items: stretch; min-height: 0; }
  .case-gateway-copy { width: 100%; padding: 20px 0 0; }
  .case-gateway-copy .eyebrow { font-size: 9px; margin-bottom: 17px; }
  .case-gateway-copy h2 { font-size: clamp(34px,8.6vw,48px); line-height: 1.36; }
  .case-gateway-intro { font-size: 13px; margin-top: 15px; }
  .case-gateway-link { gap: 17px; margin-top: 18px; font-size: 14px; }
  .case-link-arrow { width: 42px; height: 42px; }
  .case-link-arrow svg { width: 21px; height: 21px; }
  .case-routes { margin-top: 20px; font-size: 9px; gap: 17px; }
  .case-art { position: relative; right: auto; top: auto; transform: none; width: calc(100% + 60px); margin: -15px 0 4px -22px; order: 2; -webkit-mask-image: none; mask-image: none; }
  .case-watermark { top: auto; bottom: 24%; right: -3%; font-size: 88px; }
  .case-motion-toggle { bottom: 0; right: 0; font-size: 9px; }
  :lang(en) .case-gateway-copy h2 { font-size: 36px; }
  .case-back { margin-bottom: 26px; }
  .case-page-intro { font-size: 14px; line-height: 1.8; }
  .case-page-art { width: calc(100% + 40px); margin: 30px -20px 24px; }
}
@media(prefers-reduced-motion:reduce) {
  .case-ribbon { animation: none; }
  .case-art-parallax, .case-art-entrance { transform: none; transition: none; }
  .case-motion-toggle { display: none !important; }
  .case-gateway-link:hover .case-link-arrow, .case-gateway-link:hover svg { transform: none; }
}
