/* ===================================================================
   ALBA — wedding albums page (navazuje na style.css)
   =================================================================== */
.albapage{ background:var(--cream); }

/* ---- nav ---- */
.anav{
  position:sticky; top:0; z-index:900; display:flex; align-items:center; justify-content:space-between;
  padding:1.1rem var(--pad); background:rgba(244,239,231,.9); backdrop-filter:blur(14px) saturate(1.1);
  border-bottom:1px solid var(--line); color:var(--ink);
}
.anav__links{ display:flex; gap:1.8rem; align-items:center; }
.anav__links a{ font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; position:relative; }
.anav__links a::after{ content:""; position:absolute; left:0; bottom:-5px; height:1px; width:0; background:currentColor; transition:width .4s var(--ease); }
.anav__links a:hover::after{ width:100%; }
.anav__cta{ border:1px solid currentColor; padding:.55rem 1.1rem; border-radius:40px; }
.anav__cta::after{ display:none; }
.anav__cta:hover{ background:var(--ink); color:var(--cream); }

/* ---- hero ---- */
.ahero{ text-align:center; padding:clamp(3rem,8vh,6rem) var(--pad) clamp(1.5rem,4vh,2.5rem); max-width:760px; margin:0 auto; }
.ahero .kicker{ display:block; margin-bottom:1rem; }
.ahero h1{ font-family:var(--ff-serif); font-weight:300; font-size:clamp(2.4rem,6vw,4.4rem); line-height:1.02; letter-spacing:-.01em; }
.ahero p{ margin:1.3rem auto 0; max-width:48ch; color:var(--ink-soft); font-size:1.05rem; }

/* ---- album index ---- */
.albums{ max-width:var(--maxw); margin:0 auto; padding:clamp(1.5rem,4vh,3rem) var(--pad) clamp(4rem,10vh,7rem); }
.albums__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2vw,1.8rem); }
.album{ position:relative; cursor:none; overflow:hidden; border-radius:3px; opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.album.is-in{ opacity:1; transform:none; }
.album__media{ aspect-ratio:3/2; overflow:hidden; }
.album__media img{ width:100%; height:100%; object-fit:cover; transform:scale(1.03); filter:saturate(.95); transition:transform 1.1s var(--ease), filter .8s; }
.album:hover .album__media img{ transform:scale(1.1); filter:saturate(1.05); }
.album__overlay{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding:1.4rem; color:var(--white);
  background:linear-gradient(0deg, rgba(20,16,12,.66) 0%, rgba(20,16,12,.05) 55%); }
.album__title{ font-family:var(--ff-serif); font-size:1.6rem; line-height:1.1; }
.album__count{ font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; opacity:.85; margin-top:.3rem; }
.album__arrow{ position:absolute; top:1.1rem; right:1.1rem; width:2.4rem; height:2.4rem; border-radius:50%; background:rgba(244,239,231,.16); backdrop-filter:blur(4px); display:grid; place-items:center; color:var(--white); transform:translateX(8px); opacity:0; transition:.4s var(--ease); }
.album:hover .album__arrow{ transform:none; opacity:1; }

/* ---- album view ---- */
.albumView{ max-width:var(--maxw); margin:0 auto; padding:clamp(1.5rem,4vh,3rem) var(--pad) clamp(4rem,10vh,7rem); }
.albumView__head{ display:flex; align-items:baseline; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding-bottom:1.4rem; margin-bottom:2rem; border-bottom:1px solid var(--line); }
.albumView__back{ font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; color:var(--clay-deep); cursor:none; }
.albumView__title{ font-family:var(--ff-serif); font-weight:300; font-size:clamp(2rem,5vw,3.6rem); }
.albumView__count{ font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-soft); }
.aphotos{ columns:3; column-gap:clamp(.8rem,1.6vw,1.4rem); }
.aphoto{ break-inside:avoid; margin-bottom:clamp(.8rem,1.6vw,1.4rem); overflow:hidden; border-radius:2px; cursor:none; position:relative; }
.aphoto img{ width:100%; display:block; transition:transform 1s var(--ease); background:var(--cream-2); }
.aphoto:hover img{ transform:scale(1.05); }
.aphoto::after{ content:""; position:absolute; inset:0; background:rgba(185,118,79,0); transition:.4s; }
.aphoto:hover::after{ background:rgba(185,118,79,.1); }

.albaloading{ text-align:center; padding:4rem var(--pad); color:var(--ink-soft); font-family:var(--ff-serif); font-style:italic; font-size:1.2rem; }

@media (max-width:900px){ .albums__grid{ grid-template-columns:repeat(2,1fr); } .aphotos{ columns:2; } }
@media (max-width:560px){ .albums__grid{ grid-template-columns:1fr; } .aphotos{ columns:1; } }