/* =========================================================
   Blok Instagram — len rozloženie a správanie.
   Farby a písmo nadpisu si berie z témy (.eyebrow, .lead, .btn).
   ========================================================= */

.ig{--ig-medzera:14px;--ig-naraz:4;--ig-sipka:42px}
.ig-hlava{margin:0 auto 30px}
.ig-hlava > *:last-child{margin-bottom:0}

.ig-ramec{position:relative}

/* Pás sa posúva vodorovne. Bez JavaScriptu funguje prstom aj kolieskom,
   takže sa k príspevkom dostane každý. */
.ig-pas{
  display:flex;gap:var(--ig-medzera);margin:0;padding:0;list-style:none;
  overflow-x:auto;scroll-snap-type:x proximity;scroll-behavior:smooth;
  scrollbar-width:none;-webkit-overflow-scrolling:touch
}
.ig-pas::-webkit-scrollbar{display:none}
.ig-polozka{
  flex:0 0 calc((100% - (var(--ig-naraz) - 1) * var(--ig-medzera)) / var(--ig-naraz));
  margin:0;padding:0;list-style:none;scroll-snap-align:start
}
/* téma dáva položkám zoznamu ozdobnú bodku — tu ju nechceme */
.ig-polozka::before{display:none}

.ig-post{
  display:block;position:relative;overflow:hidden;border-radius:var(--r,16px);
  background:var(--cream);line-height:0
}
/* Pomer 4:5 — tak, ako to Gabi chce mať zhodné s Instagramom. */
.ig-post img{
  width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center;
  transition:transform .4s ease
}
a.ig-post:hover img,a.ig-post:focus-visible img{transform:scale(1.05)}
a.ig-post:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.ig-znacka{
  position:absolute;top:10px;right:10px;display:grid;place-items:center;
  width:28px;height:28px;border-radius:999px;background:rgba(252,248,239,.9);
  color:var(--brown);line-height:0
}

/* Šípky. JavaScript ich odkryje, až keď je pás naozaj širší než rám. */
.ig-sipka{
  display:none;position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:var(--ig-sipka);height:var(--ig-sipka);border-radius:999px;
  background:rgba(252,248,239,.94);border:1px solid rgba(121,91,51,.18);
  box-shadow:var(--shadow);color:var(--brown);cursor:pointer;padding:0
}
.ig.je-pripravena .ig-sipka{display:grid;place-items:center}
.ig-sipka.je-vlavo{left:-8px}
.ig-sipka.je-vpravo{right:-8px}
.ig-sipka::before{
  content:'';width:9px;height:9px;
  border-top:2px solid currentColor;border-right:2px solid currentColor
}
.ig-sipka.je-vlavo::before{transform:rotate(-135deg);margin-left:3px}
.ig-sipka.je-vpravo::before{transform:rotate(45deg);margin-right:3px}
.ig-sipka:hover{background:var(--cream)}
.ig-sipka[disabled]{opacity:.3;cursor:default}
.ig-sipka:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.ig-paticka{text-align:center;margin:26px 0 0}

@media(max-width:860px){
  .ig{--ig-naraz:2.2;--ig-medzera:12px}
  .ig-sipka.je-vlavo{left:0}
  .ig-sipka.je-vpravo{right:0}
}
@media(max-width:520px){
  .ig{--ig-naraz:1.4}
}

/* Kto má v systéme vypnuté animácie, dostane okamžitý posun. */
@media(prefers-reduced-motion:reduce){
  .ig-pas{scroll-behavior:auto}
  .ig-post img{transition:none}
  a.ig-post:hover img,a.ig-post:focus-visible img{transform:none}
}