/* Trent Rockets — Squad list + player detail.
   Scoped under .rk-squad so it never collides with the Rockets chrome
   (/rockets/styles.css) or Bootstrap. Adapted from the dev25 prototype. */

.rk-squad{
  --yellow:#ffe600; --orange:#f53c00; --black:#111; --ink:#1a1a1a;
  --line:#e6e6e6; --muted:#777;
  color:var(--ink);
}
.rk-squad a{color:inherit;text-decoration:none}
.rk-squad img{max-width:100%;display:block}

/* squad hero */
.rk-squad .squad-hero{background:var(--black);color:#fff;padding:40px 0 30px}
.rk-squad .squad-hero h1{font-weight:800;font-size:clamp(38px,7vw,72px);margin:0;line-height:.95;
  text-transform:uppercase;letter-spacing:1px}
.rk-squad .squad-hero h1 .amp{color:var(--yellow)}
.rk-squad .squad-hero p{color:#bbb;margin:8px 0 0;text-transform:uppercase;letter-spacing:2px}

/* tabs */
.rk-squad .tabs{display:flex;gap:6px;margin:22px 0 4px;flex-wrap:wrap}
.rk-squad .tab{font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:16px;
  padding:10px 22px;border:2px solid #fff;background:transparent;color:#fff;cursor:pointer;transition:.15s}
.rk-squad .tab:hover{background:var(--yellow);color:var(--black);border-color:var(--yellow)}
.rk-squad .tab.active{background:var(--yellow);color:var(--black);border-color:var(--yellow)}

/* squad grid + cards */
.rk-squad .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:26px 0 60px}
@media(max-width:900px){.rk-squad .grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.rk-squad .grid{grid-template-columns:1fr 1fr;gap:12px}}
.rk-squad .card{position:relative;display:block;border-radius:6px;overflow:hidden;background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.12)}
.rk-squad .card-media{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--black)}
.rk-squad .card .photo{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .4s ease}
.rk-squad .card:hover .photo{transform:scale(1.05)}
.rk-squad .namebox{background:var(--yellow);color:var(--black);padding:10px 12px}
.rk-squad .namebox .nm{display:block;font-weight:800;text-transform:uppercase;letter-spacing:.5px;font-size:16px;line-height:1.12}
.rk-squad .namebox .rl{display:block;margin-top:3px;font-weight:600;text-transform:uppercase;letter-spacing:1px;font-size:11px;opacity:.72}
.rk-squad .card .tag{position:absolute;top:10px;left:10px;background:var(--orange);color:#fff;
  font-weight:700;font-size:11px;letter-spacing:1px;text-transform:uppercase;padding:3px 8px;border-radius:3px;z-index:2}

/* placeholder tiles (no photo supplied yet) */
.rk-squad .card-media.ph,.rk-squad .shot.ph{background:linear-gradient(135deg,#1a1a1a,#2b2b2b);
  display:flex;align-items:center;justify-content:center;text-align:center;border:1px solid rgba(255,230,0,.25)}
.rk-squad .ph-in{padding:0 16px}
.rk-squad .ph-sub{display:block;text-transform:uppercase;letter-spacing:2px;color:#888;font-size:11px}
.rk-squad .squad-empty{padding:40px 0;color:var(--muted)}

/* ---- detail ---- */
.rk-squad .profile-hero{background:var(--black);color:#fff;position:relative;overflow:hidden}
.rk-squad .profile-hero::after{content:"";position:absolute;right:-60px;top:0;bottom:0;width:45%;
  background:var(--orange);transform:skewX(-12deg);opacity:.9;z-index:0}
.rk-squad .profile-hero .inner{position:relative;z-index:1;display:grid;grid-template-columns:340px 1fr;gap:30px;
  align-items:end;padding:26px 0 0}
@media(max-width:760px){.rk-squad .profile-hero .inner{grid-template-columns:1fr;gap:0}}
.rk-squad .profile-hero .shot{max-width:340px;align-self:end}
.rk-squad .shot.ph{width:100%;max-width:340px;aspect-ratio:1/1;border-radius:6px;align-self:end}
.rk-squad .profile-hero .meta{padding-bottom:34px}
.rk-squad .profile-hero .crumb{text-transform:uppercase;letter-spacing:2px;color:var(--yellow);font-size:13px;margin-bottom:8px}
.rk-squad .profile-hero h1{font-weight:800;font-size:clamp(40px,8vw,84px);line-height:.9;margin:0;text-transform:uppercase}
.rk-squad .profile-hero h1 small{display:block;font-size:.42em;color:#ddd}
.rk-squad .facts{display:flex;gap:26px;margin-top:16px;flex-wrap:wrap}
.rk-squad .facts .f b{display:block;font-weight:800;font-size:26px;color:var(--yellow);line-height:1}
.rk-squad .facts .f span{text-transform:uppercase;letter-spacing:1px;font-size:12px;color:#ccc}

/* stat section */
.rk-squad .section-title{font-weight:800;text-transform:uppercase;font-size:26px;margin:44px 0 4px;
  border-left:6px solid var(--orange);padding-left:12px}
.rk-squad .section-sub{color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-size:13px;margin:0 0 18px;padding-left:18px}
.rk-squad .statwrap{display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media(max-width:760px){.rk-squad .statwrap{grid-template-columns:1fr}}
.rk-squad .statcard{border:1px solid var(--line);border-radius:8px;overflow:hidden}
.rk-squad .statcard h3{text-transform:uppercase;letter-spacing:1px;margin:0;background:var(--black);color:var(--yellow);padding:10px 16px;font-size:16px}
.rk-squad .statgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line)}
.rk-squad .statgrid .cell{background:#fff;padding:14px 8px;text-align:center}
.rk-squad .statgrid .cell b{display:block;font-weight:800;font-size:26px;line-height:1;color:var(--ink)}
.rk-squad .statgrid .cell span{text-transform:uppercase;font-size:11px;letter-spacing:1px;color:var(--muted)}
.rk-squad .statgrid.zero .cell b{color:#c9c9c9}

/* highlights */
.rk-squad .hl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:760px){.rk-squad .hl-grid{grid-template-columns:1fr 1fr}}
.rk-squad .hl{position:relative;display:block;border-radius:8px;overflow:hidden;background:#000;aspect-ratio:16/9}
.rk-squad .hl img{width:100%;height:100%;object-fit:cover;opacity:.85;transition:.3s}
.rk-squad .hl:hover img{opacity:1}
.rk-squad .hl .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.rk-squad .hl .play::before{content:"";width:0;height:0;border-left:22px solid #fff;border-top:14px solid transparent;
  border-bottom:14px solid transparent;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6));margin-left:6px}
.rk-squad .hl .cap{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(to top,rgba(0,0,0,.8),transparent);
  color:#fff;font-size:13px;padding:18px 12px 8px}
.rk-squad .hint{color:var(--muted);font-size:13px;margin:10px 0 0}

/* socials + back */
.rk-squad .socials{display:flex;gap:12px;margin-top:16px}
.rk-squad .socials a{width:40px;height:40px;border-radius:50%;background:#222;color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700}
.rk-squad .socials a:hover{background:var(--orange)}
.rk-squad .backlink{display:inline-block;margin:30px 0 60px;text-transform:uppercase;letter-spacing:1px;font-weight:600;color:var(--orange)}
