/* ===================================================================
   Tomas Lebedevas — Fotografija
   Šilta paletė, serifinė tipografija, teminės sekcijos.
   =================================================================== */

:root{
  /* Paletė: espreso ruda + kreminė. Sąmoningai ne juoda —
     nuotraukos ant šiltos bazės atrodo ramiau. */
  --tamsi:      #4a4038;
  --tamsi-gili: #3b332c;
  --krem:       #f4f1ea;
  --krem-sokis: #e3dccd;   /* plyteles fonas, kol nuotrauka dar nekrauta */
  --tekstas:    #2e2823;
  --tekstas-svelnus: #6f655b;
  --ant-tamsios: #f4f1ea;
  --ant-tamsios-svelnus: #c9bfb2;
  --linija:     #ded6c8;

  --serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --max: 1440px;
  --tarpas: 14px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--krem);
  color:var(--tekstas);
  font:16px/1.65 var(--sans);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%}

/* --- Antraštė ------------------------------------------------------ */
.site-header{
  position:sticky;top:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:calc(20px + env(safe-area-inset-top)) calc(40px + env(safe-area-inset-right)) 20px calc(40px + env(safe-area-inset-left));
  background:var(--tamsi);
  color:var(--ant-tamsios);
}
.brand{
  font-family:var(--serif);
  font-size:24px;font-weight:500;letter-spacing:.01em;
}
.site-header nav{display:flex;gap:26px;font-size:14px;letter-spacing:.02em}
.site-header nav a{color:var(--ant-tamsios-svelnus);padding-bottom:3px;border-bottom:1px solid transparent}
.site-header nav a:hover{color:var(--ant-tamsios);border-bottom-color:var(--ant-tamsios)}

/* --- Įžanga -------------------------------------------------------- */
.iznaga{
  background:var(--tamsi);color:var(--ant-tamsios);
  text-align:center;
  padding:88px 28px 150px;
  position:relative;
}
.iznaga h1{
  font-family:var(--serif);
  margin:0 0 14px;
  font-size:clamp(3rem,8vw,6rem);
  font-weight:400;letter-spacing:.04em;line-height:1;
}
.iznaga p{
  margin:0 auto;max-width:34em;
  color:var(--ant-tamsios-svelnus);
  font-size:1.02rem;letter-spacing:.02em;
}

/* Lenktas perėjimas iš tamsios juostos į kreminę.
   Elipsė platesnė už ekraną, todėl lankas švelnus. */
.lankas{
  position:absolute;left:-10%;right:-10%;bottom:-1px;
  height:110px;
  background:var(--krem);
  border-radius:50% 50% 0 0 / 100% 100% 0 0;
}
.lankas--virsus{
  top:-1px;bottom:auto;
  border-radius:0 0 50% 50% / 0 0 100% 100%;
}

/* --- Sekcija ------------------------------------------------------- */
.sekcija{margin:0 0 10px}

.sekcija__juosta{
  position:relative;
  background:var(--tamsi);color:var(--ant-tamsios);
  text-align:center;
  padding:120px 28px 130px;
}
.sekcija__juosta h2{
  font-family:var(--serif);
  margin:0 0 10px;
  font-size:clamp(2.4rem,6vw,4.2rem);
  font-weight:400;letter-spacing:.08em;text-transform:uppercase;line-height:1;
}
.sekcija__juosta p{
  margin:0 auto;max-width:32em;
  color:var(--ant-tamsios-svelnus);
  font-size:.98rem;letter-spacing:.02em;
}
.sekcija__kiekis{
  display:block;margin-top:16px;
  font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ant-tamsios-svelnus);opacity:.7;
}

/* --- Galerija ------------------------------------------------------ */
.galerija{
  max-width:var(--max);
  margin:0 auto;
  padding:64px calc(40px + env(safe-area-inset-left)) 84px calc(40px + env(safe-area-inset-right));
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:var(--tarpas);
  align-items:start;
}
.tile{
  margin:0;padding:0;border:0;
  position:relative;overflow:hidden;
  background:var(--krem-sokis);
  cursor:zoom-in;
}
.tile img{
  width:100%;height:auto;object-fit:contain;display:block;
  opacity:1;transition:opacity .6s ease,transform .6s ease;
}
.tile img.loaded{opacity:1}
.tile:hover img{transform:scale(1.035)}
.tile:focus-visible{outline:2px solid var(--tamsi);outline-offset:3px}
.tile figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:30px 16px 14px;
  font-family:var(--serif);
  font-size:1.05rem;letter-spacing:.02em;text-align:left;color:#fff;
  background:linear-gradient(transparent,rgba(35,29,24,.78));
  opacity:0;transition:opacity .3s;
}
.tile:hover figcaption,.tile:focus-visible figcaption{opacity:1}

.empty{grid-column:1/-1;text-align:center;color:var(--tekstas-svelnus);padding:60px 0}
.empty code{background:var(--krem-sokis);padding:2px 6px;border-radius:3px;font-size:.9em}

/* --- Apie / kontaktai ---------------------------------------------- */
.puslapio-galas{
  position:relative;
  background:var(--tamsi-gili);color:var(--ant-tamsios);
  padding:140px 28px calc(70px + env(safe-area-inset-bottom));
}
.vidus{max-width:620px;margin:0 auto;text-align:center}
.puslapio-galas h2{
  font-family:var(--serif);
  font-size:2rem;font-weight:400;letter-spacing:.06em;
  margin:0 0 18px;
}
.puslapio-galas p{color:var(--ant-tamsios-svelnus);margin:0 0 16px}
.puslapio-galas a.pastas{
  font-family:var(--serif);font-size:1.3rem;
  color:var(--ant-tamsios);border-bottom:1px solid rgba(244,241,234,.35);
  padding-bottom:3px;
}
.puslapio-galas a.pastas:hover{border-bottom-color:var(--ant-tamsios)}
.skyrikis{
  width:46px;height:1px;background:rgba(244,241,234,.3);
  margin:34px auto;
}
.fine{font-size:12.5px;letter-spacing:.04em;opacity:.6}

/* --- Lightbox ------------------------------------------------------ */
.lightbox{
  position:fixed;inset:0;z-index:100;
  display:flex;align-items:center;justify-content:center;
  background:rgba(30,25,21,.975);
}
.lightbox[hidden]{display:none}
.lightbox img{max-width:92vw;max-height:84vh;object-fit:contain}
.lb-close,.lb-nav{
  position:absolute;background:none;border:0;color:var(--krem);
  cursor:pointer;line-height:1;opacity:.6;transition:opacity .2s;
}
.lb-close:hover,.lb-nav:hover{opacity:1}
.lb-close{top:calc(22px + env(safe-area-inset-top));right:28px;font-size:34px}
.lb-nav{top:50%;transform:translateY(-50%);font-size:50px;padding:12px 22px}
.lb-prev{left:6px}
.lb-next{right:6px}
.lb-caption{
  position:absolute;bottom:calc(26px + env(safe-area-inset-bottom));left:0;right:0;
  text-align:center;color:var(--krem);
  font-family:var(--serif);font-size:1.15rem;letter-spacing:.03em;
}
.lb-caption span{
  display:block;margin-top:5px;
  font-family:var(--sans);font-size:11.5px;letter-spacing:.16em;
  text-transform:uppercase;opacity:.55;
}

/* --- Mobilus ------------------------------------------------------- */
@media(max-width:760px){
  .site-header{
    flex-direction:column;gap:12px;
    padding:calc(16px + env(safe-area-inset-top)) 18px 14px;
  }
  .brand{font-size:20px}
  .site-header nav{gap:18px;font-size:13px}
  .iznaga{padding:60px 20px 110px}
  .sekcija__juosta{padding:84px 22px 96px}
  .lankas{height:70px}
  .galerija{padding:38px 10px 52px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:7px}
  .tile figcaption{display:none}
  .puslapio-galas{padding:100px 22px calc(56px + env(safe-area-inset-bottom))}
  .lb-nav{font-size:36px;padding:10px}
}

@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
}