/* =============================================================
   links.hacettepetenis.com — dikey bağlantı sayfası
   Ana siteyle aynı palet; içerik yönetim panelinden gelir.
   ============================================================= */
:root{
  --court:#0B6E4F;
  --court-deep:#063325;
  --court-line:#F7F8F3;
  --optic:#CDEA45;
  --optic-deep:#B4D42E;
  --ink:#0C1A14;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:'Archivo',system-ui,-apple-system,sans-serif;
  background:var(--court-deep);
  color:var(--court-line);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  min-height:100dvh;
  position:relative;
  overflow-x:hidden;
}
/* Arka planda sitedeki gerçek oranlı kort deseni */
body::before,body::after{content:'';position:fixed;inset:0;pointer-events:none}
body::before{background:url('court.svg') center/cover no-repeat;opacity:.13}
body::after{background:radial-gradient(ellipse 80% 60% at 50% 12%, rgba(11,110,79,.45) 0%, rgba(6,51,37,0) 70%)}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.lk{
  position:relative;z-index:2;
  width:100%;max-width:520px;margin:0 auto;
  padding:calc(38px + env(safe-area-inset-top)) 20px calc(40px + env(safe-area-inset-bottom));
  display:flex;flex-direction:column;align-items:center;gap:14px;
}

/* --------------------------------- profil -------------------------------- */
.lk-avatar{
  width:104px;height:104px;border-radius:50%;object-fit:contain;background:rgba(247,248,243,.08);
  border:2px solid rgba(247,248,243,.18);padding:10px;
}
.lk-title{
  font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;
  font-size:clamp(1.5rem,7vw,2.1rem);line-height:1.18;text-align:center;margin-top:6px;
}
.lk-handle{font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--optic)}
.lk-bio{text-align:center;color:rgba(247,248,243,.78);font-size:.95rem;max-width:420px}

/* -------------------------------- kartlar -------------------------------- */
.lk-card{
  width:100%;border-radius:16px;padding:16px 18px;
  background:rgba(205,234,69,.14);border:1px solid rgba(205,234,69,.4);
  display:flex;gap:14px;align-items:flex-start;
}
.lk-card .k{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--optic);font-weight:700}
.lk-card b{display:block;font-size:1.02rem;margin-top:3px}
.lk-card p{color:rgba(247,248,243,.75);font-size:.88rem;margin-top:3px}
.lk-card .go{margin-left:auto;align-self:center;color:var(--optic);font-weight:800;flex:none}

/* ------------------------------ bağlantılar ------------------------------ */
.lk-links{width:100%;display:flex;flex-direction:column;gap:11px;margin-top:6px}
.lk-btn{
  display:flex;align-items:center;gap:14px;width:100%;
  background:rgba(247,248,243,.07);border:1px solid rgba(247,248,243,.16);
  border-radius:14px;padding:15px 18px;transition:transform .14s, background .14s, border-color .14s;
  min-height:60px;
}
.lk-btn:hover,.lk-btn:focus-visible{background:rgba(247,248,243,.13);border-color:rgba(247,248,243,.34);transform:translateY(-2px)}
.lk-btn:active{transform:translateY(0)}
.lk-btn .ic{
  width:38px;height:38px;flex:none;border-radius:11px;display:grid;place-items:center;
  background:rgba(247,248,243,.1);color:var(--court-line);
}
.lk-btn .tx{min-width:0}
.lk-btn .tx b{display:block;font-size:1rem;font-weight:700}
.lk-btn .tx span{display:block;font-size:.82rem;color:rgba(247,248,243,.62);overflow:hidden;text-overflow:ellipsis}
.lk-btn .arrow{margin-left:auto;color:rgba(247,248,243,.45);flex:none}

/* Öne çıkan bağlantı: optik sarı */
.lk-btn.primary{background:var(--optic);border-color:var(--optic);color:var(--ink)}
.lk-btn.primary .ic{background:rgba(12,26,20,.12);color:var(--ink)}
.lk-btn.primary .tx span{color:rgba(12,26,20,.7)}
.lk-btn.primary .arrow{color:rgba(12,26,20,.5)}
.lk-btn.primary:hover{background:var(--optic-deep);border-color:var(--optic-deep)}

/* --------------------------------- alt ----------------------------------- */
.lk-foot{margin-top:22px;text-align:center;font-size:.74rem;letter-spacing:.1em;color:rgba(247,248,243,.42)}
.lk-foot a{color:rgba(247,248,243,.6)}
.lk-foot a:hover{color:var(--optic)}
.lk-error{text-align:center;color:rgba(247,248,243,.7);padding:40px 0}

/* ------------------------------- iskelet --------------------------------- */
.lk-skeleton{width:100%;display:flex;flex-direction:column;align-items:center;gap:14px}
.sk{background:rgba(247,248,243,.08);border-radius:12px;animation:pulse 1.4s infinite}
.sk-avatar{width:104px;height:104px;border-radius:50%}
.sk-title{width:70%;height:30px}
.sk-bio{width:88%;height:38px}
.sk-btn{width:100%;height:60px;border-radius:14px}
@keyframes pulse{0%,100%{opacity:.55}50%{opacity:.95}}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}
