@font-face { font-family: 'Mitesh Reference Inter'; src: url('../fonts/reference-inter.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
.m-reference-rail { padding-bottom: 18px; background: #fff; color: #000; }
.m-reference-rail__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 36px 24px 24px; }
#new .m-reference-rail__head { padding-top: 0; }
#new.m-reference-rail { padding-bottom: 24px; }
.m-main--home .m-reference-rail h2 { margin: 0; font: 400 24px/1.15 'Cormorant Garamond',Georgia,serif !important; letter-spacing: 0; text-transform: none; color: #000; }
.m-reference-rail__tools { display: flex; align-items: center; gap: 16px; }
.m-reference-rail__links { display: flex; gap: 20px; }
.m-reference-rail__track[hidden] { display: none !important; }
.m-main--home .m-reference-rail__links a[aria-current=true] { color: #12332f; text-decoration-thickness: 2px; }
.m-reference-rail__empty { grid-column: 1 / -1; padding: 40px 0; font: 400 14px/1.6 'Chillax',sans-serif; }
@media(max-width:480px) { .m-reference-rail__head { flex-wrap: wrap; gap: 8px; } .m-reference-rail__tools { margin-left: auto; } }
.m-main--home .m-reference-rail__links a { display: inline-flex; align-items: center; min-height: 44px; font: 500 14px/1.43 'Chillax',sans-serif !important; color: #164e48; text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; }
.m-reference-rail__arrows { display: flex; gap: 4px; }
.m-reference-rail__arrows button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: none; color: #000; cursor: pointer; }
.m-reference-rail__arrows button:hover { background: #f6f6f6; }
.m-reference-rail__arrows button:disabled { color: #767676; cursor: default; background: none; }
.m-reference-rail__arrows svg { width: 20px; height: 20px; }
.m-reference-rail__track { display: grid; grid-auto-flow: column; grid-auto-columns: 356px; gap: 2px; margin: 0; padding: 0 24px; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 24px; scrollbar-width: none; overscroll-behavior-x: contain; }
.m-reference-rail__track::-webkit-scrollbar { display: none; }
.m-reference-rail__card { position: relative; min-width: 0; scroll-snap-align: start; }
.m-reference-rail__media { position: relative; aspect-ratio: 356/454; overflow: hidden; background: #f6f6f6; }
.m-reference-rail__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 20%; border-radius: 0; }
.m-reference-rail__alt { opacity: 0; transition: opacity .36s; }
.m-reference-rail__card:is(:hover,:focus-within) .m-reference-rail__alt { opacity: 1; }
.m-reference-rail__meta { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 12px 12px 0 0; }
.m-main--home .m-reference-rail__meta :is(h3,a,span,bdi) { margin: 0; font: 400 14px/1.43 'Chillax',sans-serif !important; letter-spacing: 0; color: #000; }
.m-reference-rail__meta > span { flex-shrink: 0; white-space: nowrap; }
.m-reference-rail__meta a { display: inline-block; padding-block: 2px; }
.m-reference-rail__meta a::after { content: ''; position: absolute; inset: 0; }
.m-reference-rail__meta a:hover { text-decoration: underline; text-underline-offset: 4px; }
@media(max-width:1024px) { .m-reference-rail__track { grid-auto-columns: 300px; } }
@media(max-width:760px) { .m-reference-rail__head { padding: 24px 16px; } .m-reference-rail__track { grid-auto-columns: 62vw; padding-inline: 16px; scroll-padding-inline: 16px; } .m-reference-rail__arrows { display: none; } }
@media(hover:none) { .m-reference-rail__alt { display: none; } }
@media(prefers-reduced-motion:reduce) { .m-reference-rail__alt { transition: none; } }
