/* ===========================================================
   /players/kyler-murray/  —  Minnesota Vikings player profile
   Page-scoped stylesheet. Every class is prefixed .km-
   Body class: .page-murray
   Builds on style.css (tokens, ticker, header, buttons, footer).
   =========================================================== */

body.page-murray{background:#f6f8fc}
body.page-murray [id]{scroll-margin-top:88px}

/* ---------- hero ---------- */
.km-hero{position:relative;isolation:isolate;background:#180d2e;color:#fff;overflow:hidden}
.km-hero-bg{
  position:absolute;inset:0;z-index:-2;width:100%;height:100%;
  object-fit:cover;object-position:100% 4%
}
.km-hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,
    rgba(21,10,44,.96) 0%,
    rgba(26,13,54,.92) 30%,
    rgba(26,13,54,.58) 56%,
    rgba(26,13,54,.14) 80%,
    rgba(26,13,54,.04) 100%)
}
.km-hero .wrap{padding-top:22px;padding-bottom:28px;min-height:344px;display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:20px;align-items:end}
.km-hero-copy{min-width:0}

.km-crumbs ol{
  list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:9px;
  font-family:var(--display);font-weight:500;font-size:11.5px;letter-spacing:.13em;
  text-transform:uppercase;color:rgba(255,255,255,.55)
}
.km-crumbs a{color:rgba(255,255,255,.55);transition:color var(--t-fast)}
.km-crumbs a:hover{color:#fff}
.km-crumbs [aria-current]{color:#fff}

.km-eyebrow{
  display:inline-block;margin-top:12px;font-family:var(--display);font-weight:600;
  font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)
}
.km-h1{
  font-family:var(--display);font-weight:700;text-transform:uppercase;color:#fff;
  font-size:clamp(34px,5.6vw,62px);line-height:.93;letter-spacing:.01em;
  margin:10px 0 12px;text-shadow:0 3px 22px rgba(0,0,0,.55);max-width:560px
}
.km-tagline{
  font-family:var(--display);font-weight:600;font-size:14px;letter-spacing:.1em;
  text-transform:uppercase;color:rgba(255,255,255,.9);margin-bottom:10px
}
.km-lede{font-size:15.5px;line-height:1.55;color:rgba(255,255,255,.86);max-width:400px}

.km-hero-shot{
  border-radius:8px;overflow:hidden;aspect-ratio:1/1;border:2px solid rgba(68,206,227,.55);
  box-shadow:0 14px 34px rgba(0,0,0,.4);background:linear-gradient(163deg,#603099 0%,#3a1f66 62%,#2b1650 100%)
}
.km-hero-shot img{width:100%;height:100%;object-fit:cover;display:block}

/* ---------- tab bar ---------- */
.km-tabs{background:#fff;border-bottom:1px solid #e3e5ef}
.km-tabs ul{display:flex;align-items:stretch;gap:34px;overflow-x:auto;
  scrollbar-width:none;-ms-overflow-style:none}
.km-tabs ul::-webkit-scrollbar{display:none}
.km-tabs a{
  display:flex;align-items:center;min-height:48px;white-space:nowrap;
  padding:12px 2px;border-bottom:3px solid transparent;color:#5b5b70;
  font-family:var(--display);font-weight:600;font-size:13.5px;letter-spacing:.1em;
  text-transform:uppercase;transition:color var(--t-fast),border-color var(--t-fast)
}
.km-tabs a:hover{color:var(--purple)}
.km-tabs a[aria-current]{color:var(--purple);border-bottom-color:var(--gold)}

/* ---------- page frame ---------- */
.km-body{padding-top:26px;padding-bottom:var(--space-5);display:flex;flex-direction:column;gap:26px}
.km-block{min-width:0}
.km-block>.sect-title,.km-block>.sect-head{margin-bottom:14px}
.km-card{background:#fff;border:1px solid #e6e8f2;border-radius:8px;padding:16px;min-width:0}

/* ---------- top row: bio / attributes / coverage ---------- */
.km-top{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,.9fr);gap:16px;align-items:stretch}

.km-bio dl{display:grid;gap:10px}
.km-bio .km-bio-i{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:8px 0;border-bottom:1px solid #eef0f7}
.km-bio .km-bio-i:last-child{border-bottom:0;padding-bottom:0}
.km-bio dt{
  font-family:var(--display);font-weight:500;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:#6d6d7f
}
.km-bio dd{
  margin:0;font-family:var(--display);font-weight:700;font-size:14.5px;
  letter-spacing:.01em;color:#14122e;text-align:right
}

.km-attrs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:2px}
.km-attr{text-align:center;min-width:0}
.km-attr svg{width:30px;height:30px;color:var(--purple);margin:0 auto 8px}
.km-attr h3{
  font-family:var(--display);font-weight:700;font-size:11.5px;letter-spacing:.1em;
  text-transform:uppercase;color:#14122e
}
.km-attr p{font-size:12px;line-height:1.4;color:#6b6b7e;margin-top:5px}

.km-coverage{background:var(--purple);border:1px solid var(--purple);border-radius:8px;
  padding:20px;color:#fff;display:flex;flex-direction:column;justify-content:center}
.km-coverage h2{
  font-family:var(--display);font-weight:700;text-transform:uppercase;color:#fff;
  font-size:clamp(17px,2vw,20px);letter-spacing:.015em;line-height:1.15
}
.km-coverage p{font-size:13.5px;line-height:1.5;color:rgba(255,255,255,.84);margin-top:10px}
.km-coverage .km-link{margin-top:14px;display:inline-flex;align-items:center;gap:8px;
  color:var(--gold);font-family:var(--display);font-weight:600;font-size:13px;
  letter-spacing:.08em;text-transform:uppercase}
.km-coverage .km-link svg{width:15px;height:15px}

/* ---------- passing statistics table ---------- */
.km-scroll{overflow-x:auto;background:#fff;border:1px solid #e6e8f2;border-radius:8px}
table.km-table{width:100%;border-collapse:collapse;min-width:760px}
table.km-table thead th{
  background:#f1f4fa;color:#5c5c72;padding:11px 8px;text-align:center;white-space:nowrap;
  font-family:var(--display);font-weight:600;font-size:11px;letter-spacing:.13em;
  text-transform:uppercase;border-bottom:1px solid #e6e8f2
}
table.km-table thead th:first-child{text-align:left;padding-left:16px}
table.km-table tbody th{
  text-align:left;padding:13px 8px 13px 16px;font-size:14px;font-weight:700;color:#14122e;
  white-space:nowrap;border-bottom:1px solid #eef0f7
}
table.km-table tbody td{
  text-align:center;padding:13px 8px;font-size:14px;color:#45455a;white-space:nowrap;
  border-bottom:1px solid #eef0f7
}
table.km-table tbody tr:last-child th,
table.km-table tbody tr:last-child td{border-bottom:0}
table.km-table tbody tr.km-total th,table.km-table tbody tr.km-total td{
  background:#f8f6fd;font-weight:700;color:#14122e}
.km-note{font-size:13px;line-height:1.5;color:#5d5d70;margin-top:12px}

/* ---------- season game log + playing style ---------- */
.km-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.km-fixture{display:flex;flex-direction:column;gap:12px}
.km-fixture-row{display:flex;align-items:center;gap:14px;padding:12px;background:#f6f4fb;border-radius:6px}
.km-fixture-row img{width:38px;height:38px;object-fit:contain;flex:none}
.km-fixture-vs{font-family:var(--display);font-weight:600;font-size:13px;color:#6d6d7f}
.km-fixture-txt{min-width:0}
.km-fixture-txt .km-fx-wk{font-family:var(--display);font-weight:700;font-size:11.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--purple)}
.km-fixture-txt .km-fx-main{font-size:15px;font-weight:700;color:#14122e;margin-top:2px}
.km-fixture-txt .km-fx-sub{font-size:12.5px;color:#6b6b7e;margin-top:2px}
.km-fixture-status{
  margin-left:auto;font-family:var(--display);font-weight:700;font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;color:#137887;background:#fff3d6;
  border-radius:20px;padding:6px 12px;flex:none
}

.km-style p{font-size:14px;line-height:1.6;color:#3a3a48}
.km-style p+p{margin-top:12px}
.km-style-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.km-style-tags span{
  background:#f1f4fa;border-radius:20px;padding:6px 14px;font-family:var(--display);
  font-weight:600;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#4b4b60
}

/* ---------- career chronology ---------- */
.km-chrono{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;position:relative}
.km-chrono::before{
  content:"";position:absolute;top:9px;left:12.5%;right:12.5%;height:2px;background:#e2e4ef;z-index:0
}
.km-stop{position:relative;z-index:1;text-align:center;min-width:0}
.km-stop::before{
  content:"";display:block;width:18px;height:18px;border-radius:50%;background:#fff;
  border:3px solid var(--purple);margin:0 auto 12px
}
.km-stop h3{
  font-family:var(--display);font-weight:700;font-size:12.5px;letter-spacing:.12em;
  text-transform:uppercase;color:#14122e
}
.km-stop p{font-size:12.5px;line-height:1.5;color:#6b6b7e;margin-top:6px}

/* ---------- news ---------- */
.km-news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.km-ncard{
  background:#fff;border:1px solid #e6e8f2;border-radius:8px;overflow:hidden;min-width:0;
  display:flex;flex-direction:column;transition:box-shadow var(--t),transform var(--t)
}
.km-ncard:hover{box-shadow:0 10px 26px rgba(20,15,40,.12);transform:translateY(-3px)}
.km-nmedia{display:block;aspect-ratio:19/8;background:#ded9e6;overflow:hidden}
.km-nmedia img{width:100%;height:100%;object-fit:cover;transition:transform 400ms ease}
.km-ncard:hover .km-nmedia img{transform:scale(1.04)}
.km-nbody{padding:13px 15px 16px;display:flex;flex-direction:column;flex:1}
.km-nmeta{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.km-nmeta .tag-cat{margin-bottom:0}
.km-nmeta time{font-size:12.5px;color:#727285}
.km-ncard h3{font-size:17px;font-weight:700;line-height:1.28;color:#14122e;margin:7px 0 6px}
.km-ncard p{font-size:13.5px;line-height:1.5;color:#6b6b7e}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .km-top{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:900px){
  .km-hero .wrap{padding-top:20px;padding-bottom:24px;min-height:0;grid-template-columns:minmax(0,1fr);}
  .km-hero-bg{object-position:72% center}
  .km-hero::after{background:linear-gradient(180deg,rgba(21,10,44,.70) 0%,rgba(21,10,44,.90) 62%,rgba(21,10,44,.96) 100%)}
  .km-h1{max-width:none}
  .km-lede{max-width:none}
  .km-hero-shot{max-width:180px}
  .km-pair{grid-template-columns:minmax(0,1fr)}
  .km-news-grid{grid-template-columns:minmax(0,1fr)}
  .km-tabs ul{gap:22px}
  .km-chrono{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:22px}
  .km-chrono::before{display:none}
}
@media (max-width:620px){
  .km-attrs-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .km-bio-i{flex-direction:column;align-items:flex-start;gap:2px}
  .km-bio dd{text-align:left}
  .km-fixture-row{flex-wrap:wrap}
  .km-fixture-status{margin-left:0}
}

@media (prefers-reduced-motion:reduce){
  .km-ncard,.km-nmedia img,.km-tabs a{transition:none}
  .km-ncard:hover{transform:none}
  .km-ncard:hover .km-nmedia img{transform:none}
}
