/* =============================================================
   card.hacettepetenis.com — anlaşmalı kulüpler kartı
   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;
}
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}

.cd{
  position:relative;z-index:2;
  width:100%;max-width:920px;margin:0 auto;
  padding:calc(40px + env(safe-area-inset-top)) 20px calc(48px + env(safe-area-inset-bottom));
}

/* --------------------------------- başlık -------------------------------- */
.cd-head{text-align:center;margin-bottom:34px}
.cd-logo{width:76px;height:76px;border-radius:50%;object-fit:contain;background:rgba(247,248,243,.08);
  border:2px solid rgba(247,248,243,.18);margin:0 auto 16px}
.cd-title{
  font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;
  font-size:clamp(1.6rem,6vw,2.3rem);line-height:1.18;
}
.cd-intro{color:rgba(247,248,243,.78);font-size:.98rem;max-width:560px;margin:12px auto 0}

/* --------------------------------- grid ----------------------------------- */
.cd-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin-top:8px;
}
.cd-card{
  background:rgba(247,248,243,.07);border:1px solid rgba(247,248,243,.16);border-radius:16px;
  padding:20px;display:flex;flex-direction:column;gap:10px;
}
.cd-card-head{display:flex;align-items:center;gap:12px}
.cd-card-logo{
  width:48px;height:48px;flex:none;border-radius:12px;object-fit:cover;
  background:rgba(247,248,243,.1);
}
.cd-card-logo.ph{display:grid;place-items:center;font-family:'Anton',sans-serif;font-size:1.2rem;color:var(--optic)}
.cd-card h2{font-size:1.08rem;font-weight:800;line-height:1.25}
.cd-note{
  align-self:flex-start;background:rgba(205,234,69,.16);border:1px solid rgba(205,234,69,.4);color:var(--optic);
  font-size:.78rem;font-weight:700;padding:5px 11px;border-radius:999px;
}
.cd-meta{color:rgba(247,248,243,.68);font-size:.86rem;display:flex;flex-direction:column;gap:3px}
.cd-link{
  margin-top:auto;display:inline-flex;align-items:center;gap:6px;color:var(--optic);font-weight:700;font-size:.88rem;
  padding-top:4px;
}
.cd-link:hover{color:var(--optic-deep)}

.cd-empty{text-align:center;color:rgba(247,248,243,.65);padding:60px 20px}

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

/* ------------------------------- iskelet ----------------------------------- */
.cd-skeleton{width:100%}
.sk{background:rgba(247,248,243,.08);border-radius:12px;animation:pulse 1.4s infinite}
.sk-title{width:60%;height:34px;margin:0 auto 14px}
.sk-bio{width:80%;height:20px;margin:0 auto 30px}
.sk-card{height:120px;border-radius:16px}
@keyframes pulse{0%,100%{opacity:.55}50%{opacity:.95}}

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

@media(max-width:480px){
  .cd-grid{grid-template-columns:1fr}
}
