/* Scoped adaptation of the supplied v11-insel-rand reference. */
.blog-link { --blog-ink: #07110f; --blog-mint: #22e6bd; --blog-teal: #33b4a2; --blog-ease: cubic-bezier(.2, .7, .2, 1); --blog-spring: cubic-bezier(.3, 1.2, .45, 1); --blog-hex: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%); position: fixed; z-index: 990; top: 50%; right: .45rem; width: 0; height: 0; opacity: 0; pointer-events: none; color: #fff; filter: drop-shadow(0 10px 22px rgb(3 8 7 / .3)) drop-shadow(0 0 1px rgb(255 255 255 / .45)); transform: translateX(64px); transition: opacity 280ms ease, transform 460ms var(--blog-ease); font: 600 .86rem/1.3 'Instrument Sans', sans-serif; }
.blog-link[hidden] { display: none; }
.blog-link.is-shown { opacity: 1; pointer-events: auto; transform: none; }
.blog-link--fallback { opacity: 1; pointer-events: auto; transform: none; }
.blog-link.blog-link--fallback:focus-visible { outline: none; box-shadow: none; }
.blog-link--fallback:focus-visible .blog-link__shape { outline: 2px solid var(--blog-mint); outline-offset: -4px; }
.blog-link *, .blog-link *::before, .blog-link *::after { box-sizing: border-box; }
.blog-link a { color: inherit; text-decoration: none; }
.blog-link svg { display: block; flex: 0 0 auto; }
.blog-link__shape { --cut: 15px; position: absolute; top: 0; right: 0; width: var(--w, 44px); height: var(--h, 96px); overflow: hidden; background: var(--blog-ink); color: #fff; clip-path: polygon(50% 0, 100% var(--cut), 100% calc(100% - var(--cut)), 50% 100%, 0 calc(100% - var(--cut)), 0 var(--cut)); transform: translateY(-50%); transition: width 520ms var(--blog-spring), height 520ms var(--blog-spring), clip-path 520ms var(--blog-spring), background-color 300ms ease; }
.blog-link[data-state="line"] .blog-link__shape { --cut: 1px; background: var(--blog-teal); }
.blog-link[data-state="open"] .blog-link__shape { clip-path: polygon(13px 0, 100% 0, 100% 100%, 13px 100%, 0 calc(100% - 22px), 0 22px); }
.blog-link__layer { position: absolute; top: 0; right: 0; opacity: 0; pointer-events: none; transition: opacity 180ms ease; }
.blog-link[data-state="compact"] .blog-link__bar,
.blog-link[data-state="open"] .blog-link__card { opacity: 1; pointer-events: auto; transition: opacity 260ms ease 160ms; }
.blog-link__bar { display: flex; align-items: stretch; white-space: nowrap; }
.blog-link__trigger { display: grid; width: 44px; min-height: 96px; place-items: center; padding: 1.45rem 0; border: 0; background: none; color: inherit; cursor: pointer; font: inherit; }
.blog-link__trigger:focus-visible { outline: 2px solid var(--blog-mint); outline-offset: -5px; }
.blog-link__label { display: inline-flex; align-items: center; gap: .6rem; font-size: .86rem; font-weight: 650; line-height: 1; writing-mode: vertical-rl; }
.blog-link__dot { display: block; width: .57rem; height: .66rem; flex: 0 0 auto; background: var(--blog-mint); clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); animation: blog-link-breathe 2.6s ease-in-out infinite; }
@keyframes blog-link-breathe { 50% { opacity: .6; transform: scale(1.3); } }
.blog-link__cta { display: none; }
.blog-link__card { display: block; width: min(440px, calc(100vw - 1.5rem)); max-height: var(--card-h, min(560px, calc(100svh - 1.5rem))); padding: .85rem 1.25rem 1.2rem 1.45rem; overflow-y: auto; overscroll-behavior: contain; white-space: normal; }
.blog-link__head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .35rem; }
.blog-link__name { display: inline-flex; align-items: center; gap: .6rem; font-size: .86rem; font-weight: 650; }
.blog-link__name .blog-link__dot { width: .66rem; height: auto; aspect-ratio: 2 / 1.732; clip-path: var(--blog-hex); }
.blog-link__close { display: grid; width: 44px; height: 44px; flex: 0 0 auto; place-items: center; margin-right: -.5rem; padding: 0; border: 0; background: rgb(255 255 255 / .08); color: #fff; cursor: pointer; }
.blog-link__close svg { width: 20px; height: 20px; }
.blog-link__close:hover { background: rgb(255 255 255 / .16); }
.blog-link__close:focus-visible { outline: 2px solid var(--blog-mint); outline-offset: -3px; }
.blog-link__list { margin: 0; padding: 0; list-style: none; }
.blog-link__list li { margin: 0; padding: 0; }
.blog-link__post { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: .85rem; min-height: 64px; padding: .6rem 0; border-top: 1px solid rgb(255 255 255 / .12); }
.blog-link__post img { display: block; width: 76px; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
.blog-link__post > span { display: grid; gap: .25rem; }
.blog-link__title { font-size: .9rem; font-weight: 600; line-height: 1.3; }
.blog-link__meta { display: flex; flex-wrap: wrap; gap: .15rem .65rem; color: rgb(255 255 255 / .7); font-size: .74rem; font-weight: 450; }
.blog-link__post:is(:hover, :focus-visible) .blog-link__title { color: var(--blog-mint); }
.blog-link__post:focus-visible { outline: 2px solid var(--blog-mint); outline-offset: -2px; }
.blog-link__all { display: inline-flex; min-height: 44px; align-items: center; gap: .55rem; margin-top: .4rem; border-bottom: 1px solid var(--blog-mint); color: #fff; font-size: .88rem; font-weight: 650; }
.blog-link__all svg { width: 18px; height: 18px; transition: transform 180ms ease; }
.blog-link__all:hover svg { transform: translate(3px, -3px); }
.blog-link__all:focus-visible { outline: 2px solid var(--blog-mint); outline-offset: -2px; }
.blog-link__glint { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 45%; background: linear-gradient(180deg, transparent, var(--blog-mint) 50%, transparent); opacity: 0; pointer-events: none; transform: translateY(-100%); }
.blog-link[data-state="line"] .blog-link__glint { opacity: 1; animation: blog-link-glint-y 2.6s ease-in-out 300ms infinite; }
@keyframes blog-link-glint-y { 0% { transform: translateY(-100%); } 60%, 100% { transform: translateY(230%); } }
@keyframes blog-link-glint-x { 0% { transform: translateX(-100%); } 60%, 100% { transform: translateX(230%); } }
.blog-link__teaser { position: absolute; top: 0; right: calc(var(--bar-w, 44px) + 10px); display: grid; width: max-content; max-width: min(290px, calc(100vw - 5rem)); gap: .2rem; padding: .65rem 1.3rem .7rem .95rem; background: var(--blog-ink); color: #fff; opacity: 0; pointer-events: none; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%); transform: translate(10px, -50%); transition: opacity 220ms ease, transform 380ms var(--blog-ease); }
.blog-link__teaser small { color: var(--blog-mint); font-size: .72rem; font-weight: 650; }
.blog-link__teaser span { font-size: .86rem; font-weight: 600; line-height: 1.3; }
.blog-link__teaser:hover span { text-decoration: underline; text-underline-offset: .18em; }
.blog-link__teaser:focus-visible { outline: 2px solid var(--blog-mint); outline-offset: -4px; }
.blog-link.is-teasing .blog-link__teaser { opacity: 1; pointer-events: auto; transform: translate(0, -50%); }
@media (max-width: 767px) {
  .blog-link { top: auto; right: auto; bottom: max(.9rem, env(safe-area-inset-bottom)); left: 50%; transform: translateY(80px); }
  .blog-link.is-shown, .blog-link.blog-link--fallback { transform: none; }
  .blog-link--fallback .blog-link__shape { --w: 108px; --h: 46px; }
  .blog-link__shape { top: auto; right: auto; bottom: 0; left: 50%; clip-path: polygon(var(--cut) 0, calc(100% - var(--cut)) 0, 100% 50%, calc(100% - var(--cut)) 100%, var(--cut) 100%, 0 50%); transform: translateX(-50%); }
  .blog-link[data-state="open"] .blog-link__shape { clip-path: polygon(13px 0, calc(100% - 13px) 0, 100% 22px, 100% 100%, 0 100%, 0 22px); }
  .blog-link__layer { top: auto; right: auto; bottom: 0; left: 0; }
  .blog-link__trigger { width: auto; min-height: 46px; height: 46px; padding: 0 1.15rem 0 1.4rem; }
  .blog-link__label { gap: .55rem; writing-mode: horizontal-tb; }
  .blog-link__label .blog-link__dot { width: .66rem; height: auto; aspect-ratio: 2 / 1.732; clip-path: var(--blog-hex); }
  .blog-link .blog-link__cta { display: inline-flex; height: 46px; min-height: 44px; align-items: center; gap: .5rem; margin-left: -.55rem; padding: 0 1.45rem 0 1.85rem; background: var(--blog-mint); color: var(--blog-ink); clip-path: polygon(26px 0, 100% 0, 100% 100%, 0 100%); font-size: .86rem; font-weight: 650; }
  .blog-link__cta svg { width: .95rem; height: .95rem; }
  .blog-link__cta:focus-visible { outline: 2px solid var(--blog-ink); outline-offset: -5px; }
  .blog-link__card { padding-left: 1.25rem; }
  .blog-link__teaser { display: none; }
  .blog-link__glint { width: 45%; height: 100%; background: linear-gradient(90deg, transparent, var(--blog-mint) 50%, transparent); transform: translateX(-100%); }
  .blog-link[data-state="line"] .blog-link__glint { animation-name: blog-link-glint-x; }
}
@media (prefers-reduced-motion: reduce) {
  .blog-link, .blog-link * { transition: none !important; animation: none !important; }
  .blog-link[data-state="line"] .blog-link__glint { opacity: 0; }
}
@media print { .blog-link { display: none; } }