/* Domača stran */

/* Naslovi z besedami v maski */
[data-split] .w { display: inline-block; overflow: hidden; vertical-align: top; padding-block: .14em .1em; margin-block: -.14em -.1em; }
[data-split] .w > span { display: inline-block; }

/* Nadomestki za fotografije (zamenjaj z <img>) */
.ph { position: relative; overflow: hidden; background: #111; }
.ph > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__bg > img { object-position: 70% 25%; }
.profile__img > img { object-position: 50% 20%; }
.panel__bg--melbourne > img { object-position: 50% 20%; }
.ph::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .35; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.ph__ball {
  position: absolute; width: clamp(28px, 3.2vw, 52px); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #F6FFB0, var(--accent) 45%, #94AD18);
  box-shadow: 0 0 60px 12px rgba(220,242,74,.28), 0 30px 40px -10px rgba(0,0,0,.5);
}
.ph--night {
  background:
    radial-gradient(60% 55% at 50% 0%, rgba(255,255,255,.16), transparent 70%),
    radial-gradient(90% 70% at 50% 110%, #133826 0%, transparent 70%),
    #070807;
}
.ph--night .ph__court { position: absolute; inset: 0; width: 100%; height: 100%; color: rgba(255,255,255,.16); }
.ph--night .ph__ball { left: 62%; top: 34%; }
.ph--hard { background: radial-gradient(80% 60% at 30% 20%, #2E77C0, transparent 70%), linear-gradient(170deg, #1B5B9E, #0A2340); }
.ph--hard::before {
  content: ""; position: absolute; inset: 16% 22%; border: 2px solid rgba(255,255,255,.4);
  background: linear-gradient(90deg, transparent calc(50% - 1px), rgba(255,255,255,.4) 0 calc(50% + 1px), transparent 0) 50% 50% / 100% 56% no-repeat;
  transform: perspective(900px) rotateX(48deg); transform-origin: 50% 100%;
}
.ph--hard .ph__ball { left: 58%; top: 30%; }
.ph--grass {
  background:
    radial-gradient(70% 60% at 70% 10%, rgba(255,255,255,.14), transparent 70%),
    repeating-linear-gradient(90deg, #2C6436 0 8%, #255830 8% 16%);
}
.ph--grass::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.35)); }
.ph--clay { background: radial-gradient(70% 60% at 30% 20%, #C9693C, transparent 70%), linear-gradient(170deg, #B0522A, #6A2A12); }

/* Hero */
.hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; color: #fff; overflow: hidden; }
.hero__bg { position: absolute; inset: 0; }
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(90deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.5) 40%, transparent 68%),
    linear-gradient(180deg, rgba(0,0,0,.45) 0%, transparent 25%, transparent 50%, rgba(0,0,0,.75) 100%);
}
@media (max-width: 767px) {
  .hero__bg > img { object-position: 64% 20%; }
  .hero::before { background: linear-gradient(180deg, rgba(0,0,0,.45) 0%, transparent 25%, rgba(0,0,0,.35) 45%, rgba(0,0,0,.88) 100%); }
}
.hero__inner {
  position: relative; z-index: 2; width: 100%; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: var(--sp-7);
  padding-block: 140px var(--sp-11);
}
.hero__kicker { grid-column: 1 / -1; color: var(--on-dark-70); }
.hero__title { font-size: var(--fs-display); line-height: .82; }
.hero__title .line { display: block; overflow: hidden; padding-block: .16em .04em; margin-top: -.16em; }
.hero__title .line > span { display: inline-block; }
.hero__title em { letter-spacing: -.03em; }
.hero__caps { font: 500 1em/1 var(--c); letter-spacing: -.055em; }
.hero__rank {
  display: grid; grid-template-columns: auto auto; grid-template-areas: "org org" "hash num" "lbl lbl";
  column-gap: var(--sp-3); padding: var(--sp-5) 0 0 var(--sp-6); border-left: 1px solid var(--on-dark-line); margin-bottom: .6em;
}
.hero__rank-org { grid-area: org; color: var(--on-dark-70); }
.hero__rank-hash { grid-area: hash; font: italic 400 2.5rem/1 var(--h); align-self: start; margin-top: .5em; }
.hero__rank-num { grid-area: num; font: 400 clamp(5rem, 3rem + 6vw, 9rem)/.9 var(--h); letter-spacing: -.04em; }
.hero__rank-lbl { grid-area: lbl; color: var(--on-dark-70); margin-top: var(--sp-3); }
.hero__scroll {
  position: absolute; z-index: 2; left: 50%; bottom: var(--sp-6); transform: translateX(-50%);
  display: grid; justify-items: center; gap: var(--sp-3); min-height: 44px; color: var(--on-dark-70); text-decoration: none;
}
.hero__scroll i { display: block; width: 1px; height: 40px; background: currentColor; transform-origin: top; animation: drop 2.2s var(--ease) infinite; }
@keyframes drop { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); transform-origin: top; } 51% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
@media (max-width: 767px) {
  .hero__inner { grid-template-columns: 1fr; gap: var(--sp-6); padding-bottom: var(--sp-9); }
  .hero__rank {
    justify-self: start; display: flex; align-items: baseline; gap: var(--sp-3); margin: 0;
    padding: var(--sp-4) 0 0; border-left: 0; border-top: 1px solid var(--on-dark-line); width: 100%;
  }
  .hero__rank-hash { font-size: 1.5rem; margin: 0; }
  .hero__rank-num { font-size: 3rem; }
  .hero__rank-lbl br { display: none; }
  .hero__rank-lbl { margin: 0 0 0 auto; }
  .hero__scroll { display: none; }
}

/* Zgodba */
.intro__grid { display: grid; grid-template-columns: 1fr 3fr; gap: var(--sp-8); }
.intro h2 { max-width: 15ch; }
.intro__cols { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-8); margin-block: var(--sp-10) var(--sp-9); max-width: 980px; }
@media (max-width: 860px) {
  .intro__grid { grid-template-columns: 1fr; }
  .intro__cols { grid-template-columns: 1fr; gap: var(--sp-6); margin-block: var(--sp-8); }
}

/* Časovnica */
.years { border-top: 1px solid var(--line); padding-top: var(--sp-6); overflow: hidden; }
.years__head { display: flex; justify-content: space-between; align-items: center; }
.years__head h2 { font: 500 var(--fs-caption)/1.3 var(--c); letter-spacing: .08em; }
.years__hint { display: inline-flex; align-items: center; gap: var(--sp-4); color: var(--ink-50); }
.years__hint i { width: 48px; height: 1px; background: currentColor; }
.years__viewport { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-block: var(--sp-11) var(--sp-12); }
.years__viewport::-webkit-scrollbar { display: none; }
.years__track { display: flex; margin: 0; padding: 0 var(--gutter); list-style: none; width: max-content; }
.year {
  width: clamp(300px, 32vw, 480px); padding: 0 var(--sp-8) 0 var(--sp-6); border-left: 1px solid var(--line-soft);
  scroll-snap-align: start; display: grid; align-content: start; gap: var(--sp-7);
}
.year__num { font: 400 clamp(5rem, 3rem + 7vw, 10.5rem)/.85 var(--h); letter-spacing: -.04em; }
.year__num sup { font: 500 var(--fs-caption)/1 var(--c); letter-spacing: .08em; vertical-align: top; margin-left: var(--sp-3); position: relative; top: .8em; }
.year p { color: var(--ink-70); max-width: 34ch; }
.year--key .year__num::after {
  content: ""; display: inline-block; width: .14em; height: .14em; border-radius: 50%; margin-left: .06em;
  background: var(--accent); box-shadow: 0 0 0 1px rgba(0,0,0,.08);
}
.years.is-pinned .years__viewport { overflow: hidden; }
@media (max-width: 767px) { .year { width: 82vw; } }

/* Velik napis */
.bigline { overflow: hidden; padding-block: var(--sp-9) var(--sp-11); border-top: 1px solid var(--line); }
.bigline__track { display: flex; width: max-content; }
.bigline span {
  padding-right: .4em; white-space: nowrap;
  font: 500 clamp(4.5rem, 1.5rem + 12vw, 16rem)/.9 var(--c); letter-spacing: -.055em;
}
.bigline em { font: italic 400 1em/1 var(--h); letter-spacing: -.03em; margin-inline: .04em; }
.no-motion .bigline__track, .bigline__track:not(.is-live) { animation: bigline 50s linear infinite; }
@keyframes bigline { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .bigline__track { animation: none !important; } }

/* Dva naslova */
.panels { display: grid; grid-template-columns: 1fr 1fr; background: #000; color: #fff; }
.panel { position: relative; min-height: 94svh; display: flex; align-items: flex-end; overflow: hidden; }
.panel__bg { position: absolute; inset: 0; transition: transform 1.2s var(--e-out); }
.panel:hover .panel__bg { transform: scale(1.03); }
.panel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.25) 0%, transparent 25%, transparent 35%, rgba(0,0,0,.9)); pointer-events: none; }
.panel__body { position: relative; z-index: 1; padding: var(--sp-9) var(--gutter); display: grid; gap: var(--sp-6); width: 100%; }
.panel__body .caps { color: var(--on-dark-70); }
.panel h2 { font-size: var(--fs-h2); }
.panel__txt { color: var(--on-dark-70); max-width: 38ch; }
.mini-score { max-width: 380px; border-top: 1px solid var(--on-dark-line); }
.mini-score__row { display: grid; grid-template-columns: 1fr repeat(3, 44px); align-items: baseline; padding-block: var(--sp-4); border-bottom: 1px solid var(--on-dark-line); color: var(--on-dark-50); }
.mini-score__row span { font: 500 var(--fs-caption)/1 var(--c); text-transform: uppercase; letter-spacing: .08em; }
.mini-score__row b { font: 400 2.25rem/1 var(--h); text-align: center; }
.mini-score__row.is-win { color: #fff; }
.mini-score__row b.lose { opacity: .45; }
.mini-score__row.is-win span::after { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); margin-left: var(--sp-3); vertical-align: 1px; }
@media (max-width: 860px) { .panels { grid-template-columns: 1fr; } .panel { min-height: 80svh; } }

/* Izjava */
.statement { text-align: center; }
.statement__txt { font: 400 clamp(2.2rem, 1.3rem + 3.6vw, 5.25rem)/1.02 var(--h); letter-spacing: -.025em; max-width: 19ch; margin-inline: auto; }
.statement__src { margin-top: var(--sp-8); color: var(--ink-50); }

/* Rezultati */
.results { padding-top: 0; }
.results__head { display: grid; grid-template-columns: 1fr 3fr; gap: var(--sp-8); align-items: end; margin-bottom: var(--sp-10); }
.slam-table { width: 100%; border-collapse: collapse; }
.slam-table th, .slam-table td { text-align: left; padding: var(--sp-6) var(--sp-5) var(--sp-6) 0; border-bottom: 1px solid var(--line-soft); vertical-align: baseline; }
.slam-table thead th { padding-block: var(--sp-4); border-bottom: 1px solid var(--line); color: var(--ink-50); }
.slam-table tbody th { font: 400 var(--fs-h3)/1 var(--h); letter-spacing: -.02em; width: 40%; }
.slam-table td { color: var(--ink-70); }
.slam-table td b { font-weight: 500; color: var(--ink); }
.slam-table td b::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 1px rgba(0,0,0,.12); margin-right: var(--sp-3); vertical-align: 1px; }
.figures { list-style: none; margin: var(--sp-12) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); }
.figures li { display: grid; gap: var(--sp-5); padding: var(--sp-7) var(--sp-6) 0 0; }
.figures li + li { padding-left: var(--sp-6); border-left: 1px solid var(--line-soft); }
.figures__num { font: 400 clamp(3.5rem, 2.2rem + 4.5vw, 7.5rem)/.85 var(--h); letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.figures .caps { color: var(--ink-50); }
@media (max-width: 860px) {
  .results__head { grid-template-columns: 1fr; gap: var(--sp-5); }
  .slam-table tbody th { font-size: var(--fs-h4); width: auto; }
  .slam-table th, .slam-table td { font-size: var(--fs-small); }
  .figures { grid-template-columns: 1fr 1fr; }
  .figures li:nth-child(3) { padding-left: 0; border-left: 0; }
  .figures li:nth-child(n+3) { margin-top: var(--sp-7); border-top: 1px solid var(--line-soft); }
}
@media (max-width: 520px) {
  .slam-table thead { display: none; }
  .slam-table tr { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--line-soft); padding-block: var(--sp-5); }
  .slam-table th, .slam-table td { border: 0; padding: var(--sp-2) var(--sp-4) var(--sp-2) 0; }
  .slam-table tbody th { grid-column: 1 / -1; margin-bottom: var(--sp-3); }
  .slam-table td::before { content: attr(data-l); display: block; font: 500 var(--fs-micro)/1.4 var(--c); text-transform: uppercase; letter-spacing: .08em; color: var(--ink-50); }
}

/* Profil */
.profile { display: grid; grid-template-columns: 1fr 1fr; background: var(--bg-soft); }
.profile__img { min-height: 760px; }
.profile__initials { position: relative; z-index: 1; font: italic 400 clamp(8rem, 4rem + 14vw, 20rem)/1 var(--h); color: rgba(255,255,255,.18); letter-spacing: -.05em; }
.profile__body { padding: var(--sp-13) var(--gutter); display: grid; gap: var(--sp-7); align-content: center; max-width: 720px; }
.profile h2 { max-width: 12ch; }
.spec { margin: var(--sp-5) 0 0; border-top: 1px solid var(--line); }
.spec div { display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-5); padding-block: var(--sp-5); border-bottom: 1px solid var(--line-soft); }
.spec dt { color: var(--ink-50); }
.spec dd { margin: 0; font: 400 1.4rem/1.2 var(--h); text-align: right; }
@media (max-width: 860px) {
  .profile { grid-template-columns: 1fr; }
  .profile__img { min-height: 60svh; }
  .profile__body { padding-block: var(--sp-11); }
}

/* Partnerji */
.partners { background: var(--green); color: #fff; }
.partners__in { display: grid; justify-items: center; gap: var(--sp-8); padding-block: var(--sp-11); text-align: center; }
.partners .caps { color: var(--on-dark-70); }
.partners ul { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: var(--sp-7) var(--sp-11); max-width: 1100px; margin: 0; padding: 0; list-style: none; }
.partners li { display: flex; align-items: center; }
.partners a { display: inline-flex; align-items: center; min-height: 44px; }
.logo { width: auto; transition: opacity var(--d-4) var(--e-out); }
.partners a:hover .logo, .partners a:focus-visible .logo { opacity: .5; }
.logo--kia { height: clamp(36px, 1.6rem + 2vw, 64px); }
.logo--asics { height: clamp(30px, 1.6rem + .8vw, 42px); }
.logo--wilson { height: clamp(44px, 2.4rem + 1vw, 58px); }
.logo--telemach { height: clamp(26px, 1.5rem + .5vw, 36px); }
.logo--triglav { height: clamp(28px, 1.6rem + .5vw, 38px); }
.logo--btc { height: clamp(50px, 2.8rem + 1vw, 66px); }
.logo--petrol { height: clamp(20px, 1.15rem + .4vw, 28px); }
@media (max-width: 640px) { .partners ul { gap: var(--sp-6) var(--sp-8); } }


/* Začetki: kolaž dveh fotografij */
.origins__grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: var(--sp-11); align-items: center; }
.origins__collage { position: relative; aspect-ratio: 1 / .9; }
.origins__ph { position: absolute; margin: 0; overflow: hidden; background: #1A1A18; }
.origins__ph img { width: 100%; height: 100%; object-fit: cover; }
.origins__ph--a { right: 0; top: 0; width: 66%; aspect-ratio: 1; }
.origins__ph--b { left: 0; bottom: 0; width: 46%; aspect-ratio: 1; outline: 12px solid var(--ink-surface); }
.origins__ph.is-empty {
  display: grid; place-items: center;
  background: repeating-linear-gradient(135deg, #1A1A18 0 14px, #1F1F1D 14px 15px);
}
.origins__ph.is-empty figcaption { color: var(--on-dark-50); text-align: center; padding: var(--sp-5); }
.origins__body { display: grid; gap: var(--sp-7); justify-items: start; max-width: 560px; }
.origins__txt { font-size: var(--fs-lead); line-height: 1.75; color: var(--on-dark-70); }
@media (max-width: 860px) {
  .origins__grid { grid-template-columns: 1fr; gap: var(--sp-10); }
  .origins__ph--b { outline-width: 8px; }
}

/* Galerija: naslov čez kolaž fotografij */
.oncourt { background: #000; color: #fff; overflow: hidden; }
.oncourt__in {
  display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--sp-6);
  padding-block: var(--sp-13); align-items: start;
}
.oncourt__kicker { grid-column: 1 / -1; grid-row: 1; text-align: center; color: var(--on-dark-70); }
.oncourt__kicker em { font: italic 400 1.1em/1 var(--h); text-transform: none; }
.oncourt__title {
  grid-column: 1 / -1; grid-row: 2; position: relative; z-index: 2; text-align: center; pointer-events: none;
  font: 500 clamp(4rem, 1rem + 12.5vw, 15rem)/.9 var(--c); letter-spacing: -.055em; margin-top: var(--sp-6);
}
.oncourt__title .line { display: block; overflow: hidden; padding-block: .1em .04em; }
.oncourt__title .line > span { display: inline-block; }
.oncourt__title em { font: italic 400 1em/1 var(--h); letter-spacing: -.03em; margin-right: .08em; }
.oncourt__a {
  grid-column: 1 / 6; grid-row: 2 / 4; margin: clamp(60px, 8vw, 140px) 0 0 calc(var(--gutter) * -1);
  aspect-ratio: 4 / 5; overflow: hidden;
}
.oncourt__a img, .oncourt__b img { width: 100%; height: 100%; object-fit: cover; }
.oncourt__a img { object-position: 50% 40%; }
.oncourt__b { grid-column: 6 / 9; grid-row: 3; margin: var(--sp-10) 0 0; display: grid; gap: var(--sp-4); }
.oncourt__b img { aspect-ratio: 4 / 5; filter: grayscale(1) contrast(1.08); }
.oncourt__b figcaption { color: var(--on-dark-50); }
.oncourt__txt { grid-column: 9 / 13; grid-row: 3; align-self: center; display: grid; gap: var(--sp-6); padding-top: var(--sp-11); }
.oncourt__txt > p:first-child { font: 400 clamp(2rem, 1.3rem + 2.2vw, 3.6rem)/1.04 var(--h); letter-spacing: -.02em; }
.oncourt__txt .caps { color: var(--on-dark-50); }
@media (max-width: 860px) {
  .oncourt__in { grid-template-columns: repeat(6, 1fr); padding-block: var(--sp-11); }
  .oncourt__a { grid-column: 1 / 6; grid-row: 3; margin-top: calc(var(--sp-9) * -1); }
  .oncourt__b { grid-column: 3 / 7; grid-row: 4; margin-top: calc(var(--sp-11) * -1); position: relative; z-index: 1; outline: 8px solid #000; }
  .oncourt__txt { grid-column: 1 / -1; grid-row: 5; padding-top: var(--sp-10); }
}