/* Página de links (/links) — abre a partir da bio do Instagram: leve, sem JS, mobile primeiro. */
@font-face {
  font-family: 'Big Shoulders Display';
  src: url(../fonts/big-shoulders-display-latin.woff2) format('woff2');
  font-weight: 500 900;
  font-display: swap;
}
@font-face {
  font-family: 'Instrument Sans';
  src: url(../fonts/instrument-sans-latin.woff2) format('woff2');
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
}
:root {
  --ink: #0d0c0b; --fg: #f2eee6; --muted: #9b958a; --spray: #ffd21f;
  --line: rgba(242, 238, 230, .14);
  --f-display: 'Big Shoulders Display', 'Arial Narrow', Impact, sans-serif;
  --f-text: 'Instrument Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; min-height: 100vh; min-height: 100svh; background: var(--ink); color: var(--fg); font-family: var(--f-text); line-height: 1.5; -webkit-font-smoothing: antialiased; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
h1, p { margin: 0; }
:focus-visible { outline: 2px solid var(--spray); outline-offset: 3px; }
.skip-link { position: fixed; left: 12px; top: 12px; z-index: 20; padding: 10px 16px; background: var(--spray); color: #141210; font-weight: 600; transform: translateY(-160%); transition: transform .2s; }
.skip-link:focus { transform: none; }

.pic { display: block; overflow: hidden; background: #24221e; }
.pic img { width: 100%; height: 100%; object-fit: cover; }

.lk-bg { position: fixed; inset: -60px; z-index: 0; }
.lk-bg .pic { width: 100%; height: 100%; background: none; }
.lk-bg img { filter: blur(30px) saturate(1.25) brightness(.45); transform: scale(1.12); }
.lk-bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(13,12,11,.5) 0%, rgba(13,12,11,.86) 55%, var(--ink) 100%); }

.lk { position: relative; z-index: 1; width: min(100%, 540px); margin: 0 auto; padding: 10px 16px 40px; }
.lk-top { display: flex; justify-content: space-between; align-items: center; min-height: 56px; }
.lk-crown { display: block; width: 22px; color: var(--spray); padding: 6px 0; }
.lk-crown svg { width: 100%; height: auto; }
.lk-lang { display: flex; }
.lk-lang a { font-size: .74rem; letter-spacing: .14em; font-weight: 600; padding: 12px 8px; opacity: .5; transition: opacity .3s; }
.lk-lang a[aria-current], .lk-lang a:hover { opacity: 1; }

.lk-card { position: relative; aspect-ratio: 4 / 5; overflow: hidden; animation: lkIn .9s var(--ease-out) both; }
.lk-card > .pic { position: absolute; inset: 0; }
.lk-card > .pic img { object-position: 50% 30%; }
.lk-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.86) 0%, rgba(0,0,0,.25) 46%, rgba(0,0,0,0) 70%); }
.lk-card__text { position: absolute; z-index: 1; left: 18px; right: 18px; bottom: 18px; }
.lk-rec { display: flex; gap: 8px; align-items: center; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 600; }
.lk-rec .dot { width: 8px; height: 8px; border-radius: 50%; background: #ff3b30; animation: rec 1.6s steps(2) infinite; }
@keyframes rec { 50% { opacity: .15; } }
.lk-name { font-family: var(--f-display); font-weight: 800; text-transform: uppercase; font-size: clamp(4.4rem, 25vw, 8rem); line-height: .78; margin: 12px 0 14px; }
.lk-role { font-size: .95rem; line-height: 1.4; color: rgba(242,238,230,.9); }
.lk-role span { color: var(--muted); }

.lk-feature {
  display: grid; grid-template-columns: 60px minmax(0, 1fr) 22px; gap: 14px; align-items: center;
  margin-top: 10px; padding: 10px 14px 10px 10px;
  background: rgba(242,238,230,.06); border: 1px solid var(--line);
  transition: border-color .3s, background-color .3s;
  animation: lkIn .8s var(--ease-out) .12s both;
}
.lk-feature:hover { border-color: var(--spray); background: rgba(255,210,31,.08); }
.lk-feature__img .pic { width: 60px; height: 60px; }
.lk-feature b { display: block; font-weight: 600; font-size: .94rem; line-height: 1.3; }
.lk-feature__go svg { width: 20px; height: 20px; color: var(--spray); }
.lk-tag { display: block; font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 600; color: var(--spray); margin-bottom: 4px; }

.lk-list { margin-top: 18px; display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.lk-item {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-columns: 34px minmax(0, 1fr) 24px; gap: 12px; align-items: center;
  min-height: 70px; padding: 12px 6px; border-bottom: 1px solid var(--line);
  transition: color .4s var(--ease-out);
  animation: lkIn .7s var(--ease-out) both; animation-delay: calc(var(--i) * 50ms + 200ms);
}
.lk-item::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--fg); transform: scaleY(0); transform-origin: bottom; transition: transform .45s var(--ease-out); }
.lk-item:hover::before, .lk-item:focus-visible::before { transform: scaleY(1); }
.lk-item:hover, .lk-item:focus-visible { color: var(--ink); }
.lk-item__n { font-family: var(--f-display); font-weight: 700; font-size: 1rem; color: var(--muted); }
.lk-item__text b { display: block; font-family: var(--f-display); font-weight: 800; text-transform: uppercase; font-size: 1.62rem; line-height: 1; }
.lk-item__text span { display: block; margin-top: 5px; font-size: .82rem; color: var(--muted); transition: color .4s; }
.lk-item:hover .lk-item__text span, .lk-item:hover .lk-item__n { color: #5a554c; }
.lk-item__icon svg { width: 22px; height: 22px; }
.lk-item.is-primary { background: var(--spray); color: #141210; border-bottom: 0; min-height: 86px; padding-inline: 14px; margin-bottom: 8px; }
.lk-item.is-primary::before { background: #141210; }
.lk-item.is-primary:hover, .lk-item.is-primary:focus-visible { color: var(--spray); }
.lk-item.is-primary .lk-item__n, .lk-item.is-primary .lk-item__text span { color: #5a4c12; }
.lk-item.is-primary:hover .lk-item__n, .lk-item.is-primary:hover .lk-item__text span { color: #b8a256; }
.lk-item.is-primary .lk-item__text b { font-size: 1.9rem; }

.lk-strip { margin-top: 30px; }
.lk-strip__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 10px; }
.lk-strip .pic { aspect-ratio: 1; }
.lk-strip img { transition: transform .8s var(--ease-out); }
.lk-strip a:hover img { transform: scale(1.06); }

.lk-foot { margin-top: 44px; text-align: center; color: var(--muted); font-size: .8rem; }
.lk-foot a { text-decoration: underline; text-underline-offset: 3px; }
.lk-motto { font-family: var(--f-display); font-weight: 900; text-transform: uppercase; font-size: clamp(2.6rem, 13vw, 4.4rem); line-height: .8; color: transparent; -webkit-text-stroke: 1px rgba(242,238,230,.38); margin-bottom: 16px; }

.grain {
  position: fixed; left: -50%; top: -50%; z-index: 30; pointer-events: none; width: 200%; height: 200%; opacity: .07;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1.4 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation: grain 1.2s steps(6) infinite;
}
@keyframes grain { 0%, 100% { transform: translate(0, 0); } 25% { transform: translate(-3%, 2%); } 50% { transform: translate(2%, -4%); } 75% { transform: translate(-4%, -1%); } }
@keyframes lkIn { from { opacity: 0; transform: translateY(16px); } }

@media (min-width: 900px) {
  .lk { padding-top: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .lk-card, .lk-feature, .lk-item, .grain, .lk-rec .dot { animation: none; }
  .lk-item::before, .lk-strip img { transition: none; }
}