/* NexC Fotografia — sekcje i komponenty */

/* ——— ciemna sala: jedna sekcja na podstronę, dla rytmu ——— */
.band-dark{background:var(--dark);color:var(--dark-ink);border-top:none}
.band-dark .label{color:var(--dark-muted)}
.band-dark .serif-lead{color:var(--dark-ink)}
.band-dark p{color:var(--dark-ink-2)}
.band-dark h1,.band-dark h2,.band-dark h3{color:var(--dark-ink)}
.band-dark .btn{background:var(--dark-ink);color:var(--dark);border-color:var(--dark-ink)}
.band-dark .btn:hover{background:transparent;color:var(--dark-ink)}
.band-dark .btn-ghost{background:none;color:var(--dark-ink);border-color:var(--dark-line)}
.band-dark .btn-ghost:hover{border-color:var(--dark-ink)}
.band-dark figcaption{border-top-color:var(--dark-line)}
.band-dark figcaption i{color:var(--dark-muted)}
.band-dark .hero-meta li{color:var(--dark-muted)}
.band-dark a.link{border-bottom-color:var(--dark-line)}
.band-dark a.link:hover{border-bottom-color:var(--dark-ink)}
.band-dark .pl-row{border-bottom-color:var(--dark-line)}
.band-dark .pl-row:first-child{border-top-color:var(--dark-ink)}
.band-dark .pl-row .name{color:var(--dark-ink-2)}
.band-dark .pl-row .dots{border-bottom-color:#4A4943}
.band-dark .pl-row .val{color:var(--dark-ink)}

/* ——— hero dzielony ——— */
.hero{padding-block:clamp(36px,6vw,76px) 0}
.hero-split{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(26px,5vw,70px);align-items:end;
}
@media (max-width:880px){ .hero-split{grid-template-columns:1fr;gap:30px;align-items:start} }
.hero-copy h1{max-width:12ch;margin:16px 0 clamp(22px,3.5vw,38px)}
.hero-meta{display:grid;gap:7px;margin:0 0 24px;padding:0;list-style:none}
.hero-meta li{font-size:13.5px;color:var(--muted)}
.hero-img img{width:100%;aspect-ratio:2/3;object-fit:cover;background:var(--sunken)}

/* ——— etykiety ścienne pod zdjęciami ——— */
figure{margin:0}
figcaption{
  margin-top:10px;padding-top:9px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:14px;align-items:baseline;
}
figcaption b{font-family:var(--serif);font-weight:400;font-size:15px;letter-spacing:-.01em}
figcaption i{
  font-style:normal;font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);white-space:nowrap;
}

/* ——— trzy plansze w nierównym rytmie ——— */
.plates{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-items:start}
.plates .p1{grid-column:1 / span 4}
.plates .p2{grid-column:5 / span 4;margin-top:clamp(22px,5vw,64px)}
.plates .p3{grid-column:9 / span 4}
.plates img{width:100%;aspect-ratio:2/3;object-fit:cover;background:var(--sunken)}
@media (max-width:760px){
  .plates{grid-template-columns:repeat(2,1fr)}
  .plates .p1{grid-column:1 / span 2}
  .plates .p2{grid-column:1 / span 1;margin-top:0}
  .plates .p3{grid-column:2 / span 1}
}

/* ——— tekst ścienny ——— */
.walltext{background:var(--paper);padding:clamp(26px,5vw,60px)}
.walltext p{color:var(--ink-2)}

/* ——— indeks kroków ——— */
.index{margin-top:clamp(26px,4vw,46px);border-top:1px solid var(--ink)}
.step{
  display:grid;grid-template-columns:40px minmax(0,1fr);gap:0 clamp(14px,3vw,40px);
  padding:clamp(18px,3vw,30px) 0;border-bottom:1px solid var(--line);
}
@media (min-width:900px){
  .step{grid-template-columns:44px minmax(0,1.1fr) minmax(0,1.9fr);align-items:start}
  .step h3{padding-right:20px}
  .step p{margin-top:5px}
}
.step-no{font-size:11px;font-weight:500;letter-spacing:.14em;color:var(--muted);padding-top:9px}
.step p{margin:8px 0 0;font-size:15.5px;color:var(--ink-2);max-width:52ch}
@media (max-width:899px){ .step h3,.step p{grid-column:2} }

/* ——— pakiety ——— */
.packs{display:grid;grid-template-columns:repeat(3,1fr);margin-top:clamp(26px,4vw,52px);border-top:1px solid var(--ink)}
@media (max-width:900px){ .packs{grid-template-columns:1fr} }
.pack{
  padding:clamp(24px,3vw,38px) clamp(18px,2.4vw,34px) clamp(26px,3vw,40px);
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  display:flex;flex-direction:column;
}
.pack:last-child{border-right:none}
@media (max-width:900px){ .pack{border-right:none} }
.pack.featured{background:var(--paper)}
.pack-no{font-size:10.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:0 0 20px;min-height:16px}
.pack.featured .pack-no{color:var(--ink)}
.pack h3{margin-bottom:5px}
.pack .hours{font-size:13px;color:var(--muted)}
.price{
  font-family:var(--serif);font-weight:200;font-size:clamp(40px,4.6vw,56px);
  line-height:1;letter-spacing:-.03em;margin:clamp(22px,3vw,36px) 0 0;font-variant-numeric:tabular-nums;
}
.price small{font-family:var(--sans);font-size:14px;font-weight:400;letter-spacing:0;margin-left:7px;color:var(--muted)}
.pack ul{list-style:none;margin:24px 0 0;padding:0}
.pack li{font-size:14.5px;line-height:1.5;color:var(--ink-2);padding:9px 0;border-top:1px solid var(--line)}
.pack li:first-child{border-top:none;padding-top:0}
.pack li b{font-weight:500;color:var(--ink)}
.pack .foot{margin-top:auto;padding-top:24px;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* ——— cennik z kropkowanymi liniami ——— */
.pricelist{display:grid;margin-top:8px}
.pl-row{display:flex;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--line)}
.pl-row:first-child{border-top:1px solid var(--ink)}
.pl-row .name{font-size:15px;color:var(--ink-2)}
.pl-row .dots{flex:1;min-width:14px;margin:0 10px;border-bottom:1px dotted var(--line-2);transform:translateY(-3px)}
.pl-row .val{font-size:14px;white-space:nowrap;font-variant-numeric:tabular-nums}
@media (max-width:420px){ .pl-row .name{font-size:14px} .pl-row .dots{margin:0 7px} }
.cols{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(26px,5vw,72px);align-items:start}
@media (max-width:820px){ .cols{grid-template-columns:1fr;gap:34px} }

/* ——— galeria o stałych proporcjach (reportaż ślubny) ——— */
.gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-items:start}
.gallery figure{grid-column:span 4}
.gallery .wide{grid-column:span 6}
.gallery .offset{margin-top:clamp(24px,5vw,72px)}
.gallery img{width:100%;aspect-ratio:2/3;object-fit:cover;background:var(--sunken);cursor:zoom-in}
@media (max-width:760px){
  .gallery{grid-template-columns:repeat(2,1fr)}
  .gallery figure,.gallery .wide{grid-column:span 1}
  .gallery .full{grid-column:span 2}
  .gallery .offset{margin-top:0}
}
@media (max-width:520px){
  .gallery{grid-template-columns:1fr}
  .gallery figure,.gallery .wide,.gallery .full{grid-column:span 1}
}

/* ——— galeria o naturalnych proporcjach (sesje: piony 9:16 i poziomy) ——— */
.gallery-free{column-count:3;column-gap:var(--gap);margin-top:clamp(24px,4vw,44px)}
.gallery-free figure{break-inside:avoid;margin-bottom:calc(var(--gap) + 10px);display:block}
.gallery-free img{width:100%;height:auto;background:var(--sunken);cursor:zoom-in}
@media (max-width:860px){ .gallery-free{column-count:2} }
@media (max-width:520px){ .gallery-free{column-count:1} }

.chapter{
  grid-column:1 / -1;display:flex;align-items:baseline;gap:14px;
  padding-top:clamp(16px,3vw,34px);margin-top:clamp(4px,1vw,14px);border-top:1px solid var(--line);
}
.chapter:first-child{border-top:none;padding-top:0;margin-top:0}
.chapter h3{font-size:clamp(18px,2.2vw,24px)}

/* ——— lightbox ——— */
.lb{position:fixed;inset:0;z-index:100;background:rgba(18,18,16,.96);display:none;place-content:center;padding:clamp(14px,4vw,48px)}
.lb.open{display:grid}
.lb img{max-width:100%;max-height:82vh;width:auto;margin:0 auto;object-fit:contain}
.lb-bar{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px clamp(14px,4vw,32px)}
.lb-bar span{font-size:10.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:#9A978E}
.lb button{background:none;border:1px solid #3C3B36;color:var(--dark-ink);padding:10px 15px;cursor:pointer;
  font-size:10.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase}
.lb button:hover{border-color:var(--dark-ink)}
.lb-nav{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:10px;padding:16px}

/* ——— formularz ——— */
form{margin-top:clamp(22px,3vw,40px);display:grid;gap:clamp(18px,2.4vw,26px);max-width:760px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.4vw,26px)}
@media (max-width:640px){ .f2{grid-template-columns:1fr} }
.field{display:grid;gap:7px}
label{font-size:10.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
input,select,textarea{
  font-family:var(--sans);font-size:16px;color:var(--ink);background:none;
  border:none;border-bottom:1px solid var(--line-2);padding:9px 0;width:100%;border-radius:0;
  transition:border-color .25s ease;
}
input:hover,select:hover,textarea:hover{border-color:var(--muted)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ink)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none}
input::placeholder,textarea::placeholder{color:#9B9991}
select{appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);
  background-position:calc(100% - 9px) calc(50% - 1px),calc(100% - 4px) calc(50% - 1px);
  background-size:5px 5px,5px 5px;background-repeat:no-repeat}
textarea{min-height:92px;resize:vertical}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-foot{display:flex;flex-wrap:wrap;align-items:center;gap:16px 26px;margin-top:6px}
.form-foot p{margin:0;font-size:12.5px;color:var(--muted);max-width:36ch}

/* ——— pytania i odpowiedzi ——— */
.faq{border-top:1px solid var(--ink);margin-top:clamp(24px,4vw,44px)}
.faq-item{padding:clamp(16px,2.6vw,26px) 0;border-bottom:1px solid var(--line)}
.faq-item h3{font-size:clamp(18px,2vw,21px);margin-bottom:7px}
.faq-item p{font-size:15px;color:var(--ink-2);margin:0}

/* ——— strona prosta (dziękujemy, 404) ——— */
.plain{min-height:52vh;display:grid;align-content:center;padding-block:clamp(56px,12vw,140px)}

/* stopka bez odstępu, gdy strona kończy się ciemną sekcją */
footer.tight{margin-top:0}
.band-dark .gallery-free img,.band-dark .gallery img{background:#2A2925}
.band-dark .walltext{background:#232220}
.band-dark .chapter{border-top-color:var(--dark-line)}
