/* Domača stran */

/* ---------- Ploščica: opis fotografije, kot v galeriji ---------- */
.ploscica { display: flex; justify-content: space-between; gap: var(--sp-5); padding-top: var(--sp-4); border-top: 1px solid var(--line); font: 400 var(--fs-caption)/1.4 var(--b); color: var(--ink-50); }
.ploscica b { font-weight: 500; color: var(--ink-70); }

/* ---------- Hero ---------- */
.hero { position: relative; height: 100svh; min-height: 620px; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; }
.hero__slika { position: absolute; inset: 0; will-change: transform; }
.hero__slika img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 58%; }
.hero__slika::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,0) 22%, rgba(0,0,0,0) 45%, rgba(0,0,0,.7) 78%, #000 100%); }
.hero__vsebina { position: relative; padding-bottom: var(--sp-6); }
.hero__vrh { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--sp-7); flex-wrap: wrap; margin-bottom: var(--sp-6); }
.hero .lead { color: var(--ink); max-width: 34ch; font-size: var(--fs-lead); }
.hero__gumbi { display: flex; flex-wrap: wrap; gap: var(--sp-4); }
.hero h1 {
  font: 300 13.4vw/.8 var(--h); font-stretch: var(--siroko); letter-spacing: -.055em; text-transform: uppercase;
  margin: 0 0 var(--sp-6) -.04em; white-space: nowrap;
}
@media (min-width: 1480px) { .hero h1 { font-size: 198px; } }
.hero__dol { display: none; }

/* ---------- Poglavja: celozaslonske fotografije ---------- */
.poglavje { position: relative; height: 100svh; min-height: 600px; overflow: hidden; display: flex; align-items: flex-end; background: #000; }
.poglavje__slika { position: absolute; inset: -8% 0; }
.poglavje__slika img { width: 100%; height: 100%; object-fit: cover; }
.poglavje__slika::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.55) 72%, rgba(0,0,0,.9) 100%); }
.poglavje .wrap { position: relative; width: 100%; padding-bottom: var(--sp-6); }
.poglavje__besedilo { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--sp-8); flex-wrap: wrap; margin-bottom: var(--sp-7); }
.poglavje h2 { font: 300 clamp(2.75rem, 1rem + 6.4vw, 8.5rem)/.86 var(--h); font-stretch: var(--siroko); letter-spacing: -.045em; text-transform: uppercase; }
.poglavje p { max-width: 36ch; color: var(--ink-70); }
.poglavje__desno { display: grid; gap: var(--sp-5); justify-items: start; max-width: 36ch; }

/* ---------- Uvod ---------- */
.uvod { display: grid; grid-template-columns: 1.15fr 1fr; gap: var(--sp-10); align-items: start; }
.uvod h2 { font-size: var(--fs-h1); max-width: 10ch; }
.uvod__desno { padding-top: var(--sp-4); }
.uvod__desno .lead + .lead { margin-top: var(--sp-5); }
.podpis { margin-top: var(--sp-8); font: 400 var(--fs-h4)/1 var(--h); font-stretch: var(--siroko); text-transform: uppercase; letter-spacing: -.01em; }
.podpis span { display: block; margin-top: var(--sp-3); font: 400 var(--fs-caption)/1.4 var(--b); font-stretch: 100%; text-transform: none; color: var(--ink-50); }
@media (max-width: 860px) { .uvod { grid-template-columns: 1fr; gap: var(--sp-7); } }

/* ---------- Serije: vodoravno drsenje ---------- */
.serije { --kartica-v: clamp(220px, calc(100svh - 360px), 560px); overflow: hidden; border-top: 1px solid var(--line-soft); }
.serije__pin { padding-block: calc(var(--top-h) + var(--sp-6)) var(--sp-7); height: 100svh; min-height: 560px; display: flex; flex-direction: column; justify-content: center; }
.serije__pin > .wrap { width: 100%; }
.serije__glava { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--sp-6); margin-bottom: var(--sp-7); }
.serije__glava h2 { font-size: var(--fs-h2); }
.serije__glava p { color: var(--ink-50); font-size: var(--fs-small); max-width: 30ch; text-align: right; }
.serije__stevec { font: 400 var(--fs-small)/1 var(--b); color: var(--ink-50); font-variant-numeric: tabular-nums; }
.serije__stevec span { color: var(--ink); }
.serije__trak { list-style: none; margin: 0; padding: 0 var(--gutter); display: flex; gap: clamp(var(--sp-5), 2vw, var(--sp-7)); width: max-content; }
.serija-kartica { width: calc(var(--kartica-v) * .78); flex: none; }
.serija-kartica a { display: block; text-decoration: none; }
.serija-kartica__slika { height: var(--kartica-v); overflow: hidden; margin-bottom: var(--sp-4); background: #0a0a0a; }
.serija-kartica__slika img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transition: transform 1.2s var(--e-out); }
.serija-kartica a:hover img { transform: scale(1.04); }
.serija-kartica .eyebrow { display: flex; justify-content: space-between; }
.serija-kartica h3 { margin-top: var(--sp-2); font-size: var(--fs-h4); font-weight: 400; text-transform: uppercase; letter-spacing: -.01em; }
.serije__napredek { margin-top: var(--sp-6); height: 1px; background: var(--line); }
.serije__napredek span { display: block; height: 100%; background: var(--ink); transform-origin: left; transform: scaleX(0); }
.no-motion .serije__trak, .serije--prst .serije__trak { width: auto; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--sp-5); scrollbar-width: none; }
.no-motion .serije__trak::-webkit-scrollbar, .serije--prst .serije__trak::-webkit-scrollbar { display: none; }
.no-motion .serija-kartica, .serije--prst .serija-kartica { scroll-snap-align: start; }
.serije--prst .serija-kartica { width: 74vw; }
.serije--prst .serije__pin { min-height: 0; height: auto; padding-block: var(--sp-10); }
.serije--prst .serija-kartica__slika { height: auto; aspect-ratio: 4 / 5; }
@media (max-width: 860px) { .serije__glava p { display: none; } }

/* ---------- Trak fotografij ---------- */
.trak-fotografij { padding-block: var(--sp-10); overflow: hidden; border-block: 1px solid var(--line-soft); }
.foto-trak { display: flex; width: max-content; will-change: transform; }
.foto-trak__vrsta { display: flex; gap: var(--sp-3); padding-right: var(--sp-3); }
.foto-trak img { height: clamp(160px, 20vw, 300px); width: auto; }

/* ---------- Detajli ---------- */
.detajli__glava { display: grid; grid-template-columns: 1.15fr 1fr; gap: var(--sp-10); align-items: end; margin-bottom: var(--sp-9); }
.detajli__glava h2 { font-size: var(--fs-h1); max-width: 11ch; }
.detajli__mreza { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: clamp(150px, 17vw, 270px); gap: var(--sp-3); }
.detajl { position: relative; overflow: hidden; }
.detajl--velik { grid-column: span 2; grid-row: span 2; }
.detajl img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--e-out); }
.detajl:hover img { transform: scale(1.05); }
.detajl span { position: absolute; left: var(--sp-4); bottom: var(--sp-4); font: 500 var(--fs-caption)/1 var(--b); color: #fff; text-shadow: 0 1px 12px rgba(0,0,0,.6); }
@media (max-width: 860px) { .detajli__glava { grid-template-columns: 1fr; gap: var(--sp-5); } .detajli__mreza { grid-template-columns: 1fr 1fr; grid-auto-rows: 150px; } }

/* ---------- Storitve: uredniški seznam ---------- */
.storitve__glava { display: grid; grid-template-columns: 1.15fr 1fr; gap: var(--sp-10); align-items: end; margin-bottom: var(--sp-9); }
.storitve__glava h2 { font-size: var(--fs-h1); }
.storitve { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--line); }
.storitev { display: grid; grid-template-columns: 1.15fr 1fr 180px; gap: var(--sp-8); align-items: center; padding-block: var(--sp-7); border-top: 1px solid var(--line); position: relative; }
.storitev h3 { font: 300 clamp(2rem, 1.2rem + 3vw, 4.25rem)/.95 var(--h); font-stretch: var(--siroko); letter-spacing: -.04em; text-transform: uppercase; transition: transform var(--d-5) var(--e-out); }
.storitev:hover h3 { transform: translateX(var(--sp-4)); }
.storitev__opis p { color: var(--ink-70); max-width: 40ch; }
.storitev__opis small { display: block; margin-top: var(--sp-4); font-size: var(--fs-caption); color: var(--ink-50); }
.storitev__opis a { display: inline-flex; min-height: 44px; align-items: center; margin-top: var(--sp-3); font-weight: 500; font-size: var(--fs-small); text-underline-offset: 5px; }
.storitev__opis a::before { content: ""; position: absolute; inset: 0; }
.storitev__slika { aspect-ratio: 4 / 3; overflow: hidden; background: #0a0a0a; }
.storitev__slika img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); transition: filter var(--d-5), transform 1.2s var(--e-out); }
.storitev:hover .storitev__slika img { filter: none; transform: scale(1.06); }
.storitev__slika--prazno { display: grid; place-items: center; border: 1px solid var(--line); background: none; font-size: var(--fs-caption); color: var(--ink-50); text-align: center; padding: var(--sp-4); }
@media (max-width: 860px) {
  .storitve__glava { grid-template-columns: 1fr; gap: var(--sp-5); }
  .storitev { grid-template-columns: 1fr 96px; gap: var(--sp-5); }
  .storitev__opis { grid-column: 1 / -1; grid-row: 2; }
}

/* ---------- Postopek ---------- */
.postopek__glava { margin-bottom: var(--sp-9); }
.postopek__glava h2 { font-size: var(--fs-h1); max-width: 12ch; }
.koraki { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-7); }
.korak { border-top: 1px solid var(--ink); padding-top: var(--sp-5); }
.korak__st { font: 300 var(--fs-h2)/1 var(--h); font-stretch: var(--siroko); letter-spacing: -.04em; color: var(--ink-50); font-variant-numeric: tabular-nums; }
.korak h3 { font-size: var(--fs-h4); margin-top: var(--sp-7); }
.korak p { margin-top: var(--sp-3); color: var(--ink-70); max-width: 34ch; }
.korak .znacka { margin-top: var(--sp-4); }
@media (max-width: 860px) { .koraki { grid-template-columns: 1fr; gap: var(--sp-8); } }

/* ---------- Navdih: Instagram ---------- */
.navdih__glava { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--sp-6); flex-wrap: wrap; margin-bottom: var(--sp-8); }
.navdih__glava h2 { font-size: var(--fs-h1); }
.navdih__profil { display: inline-flex; align-items: center; min-height: 44px; gap: var(--sp-3); text-decoration: none; font-size: var(--fs-small); }
.navdih__profil svg { width: 18px; height: 18px; }
.navdih__profil strong { font-weight: 500; }
.navdih__profil span { color: var(--ink-dark-70); }
.mreza { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-2); }
.mreza a { position: relative; aspect-ratio: 1; overflow: hidden; background: #d8d3ca; }
.mreza img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--e-out); }
.mreza a:hover img { transform: scale(1.05); }
.navdih__vec { margin-top: var(--sp-7); }
.navdih .btn--ghost { color: #000; border-color: var(--line-dark); }
.navdih .btn--ghost:hover { border-color: #000; }
@media (max-width: 767px) { .mreza { grid-template-columns: repeat(2, 1fr); } }

/* ---------- Hero: kinematografska menjava fotografij ---------- */
.hero__slike { position: absolute; inset: 0; overflow: hidden; background: #000; will-change: clip-path; }
.hero__slike::after { content: ""; position: absolute; inset: 0; z-index: 5; pointer-events: none; background: linear-gradient(180deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,0) 22%, rgba(0,0,0,0) 45%, rgba(0,0,0,.7) 78%, #000 100%); }
.hero .hero__slika { position: absolute; inset: 0; margin: 0; }
.hero .hero__slika::after { display: none; }
.hero .hero__slika:not(:first-child) { visibility: hidden; }
.js:not(.no-motion) .hero .hero__slika:not(:first-child) { visibility: visible; clip-path: inset(0 0 0 100%); }
.hero__kazalo { display: flex; gap: var(--sp-3); align-items: center; }
.hero__kazalo i { display: block; width: clamp(28px, 4vw, 56px); height: 1px; background: var(--line); position: relative; overflow: hidden; }
.hero__kazalo i::after { content: ""; position: absolute; inset: 0; background: var(--ink); transform: scaleX(var(--p, 0)); transform-origin: left; }
.hero .ploscica { align-items: center; }
[data-hero-opis] { display: inline-block; }

/* ---------- Zložene celozaslonske fotografije ---------- */
.zlozeno { position: relative; }
.poglavje { display: block; }
.poglavje__okvir { position: absolute; inset: 0; display: flex; align-items: flex-end; overflow: hidden; transform-origin: 50% 30%; will-change: transform; }
.poglavje__okvir > .wrap { z-index: 1; }
.poglavje__tema { position: absolute; inset: 0; z-index: 3; background: #000; opacity: 0; pointer-events: none; }
.poglavje__slika { inset: 0; }
.zlozeno + .section { position: relative; z-index: 5; background: #000; }