/* =============================================================
   Silver House — style.css
   ============================================================= */

@font-face{font-family:'Montserrat';src:url('assets/fonts/Montserrat-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Montserrat';src:url('assets/fonts/Montserrat-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Montserrat';src:url('assets/fonts/Montserrat-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Montserrat';src:url('assets/fonts/Montserrat-Italic.ttf') format('truetype');font-weight:400;font-style:italic;font-display:swap;}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:#ffffff;font-family:'Montserrat',system-ui,sans-serif;color:#393431;-webkit-font-smoothing:antialiased;}

@keyframes shreveal{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:none;}}
[data-reveal]{opacity:0;transform:translateY(22px);animation:shreveal .9s cubic-bezier(.2,.7,.2,1) both;animation-timeline:view();animation-range:entry 2% cover 26%;}
@supports not (animation-timeline:view()){[data-reveal]{opacity:1;transform:none;animation:none;}}

input::placeholder,textarea::placeholder{color:rgba(255,255,255,.4);}
a{color:inherit;}
a:hover{text-decoration:underline;}

@media (max-width:980px){
  [data-hdr-inner]{padding-left:22px !important;padding-right:22px !important;height:78px !important;}
  [data-nav]{display:none !important;}
  [data-hero-pad]{padding-left:22px !important;padding-right:22px !important;padding-bottom:64px !important;}
  [data-pad]{padding:84px 22px !important;}
  [data-grid="2to1"]{grid-template-columns:1fr !important;}
  [data-grid="gallery"]{grid-template-columns:1fr !important;}
  [data-grid="gallery"] > figure{grid-column:auto !important;}
  [data-grid="gallery"] img{height:300px !important;}
  [data-footgrid]{grid-template-columns:1fr !important;gap:34px !important;}
  [data-loc-grad]{background:linear-gradient(180deg,rgba(28,25,23,.25) 0%,rgba(28,25,23,.55) 46%,rgba(28,25,23,.9) 100%) !important;}
  [data-loc-inner]{align-items:flex-end !important;}
}
@media (max-width:600px){
  [data-pad]{padding:60px 18px !important;}
  [data-hero-pad]{padding-bottom:46px !important;}
  [data-ba-pair]{grid-template-columns:1fr !important;gap:16px !important;}
  [data-eyebrow]{letter-spacing:.18em !important;font-size:10px !important;}
  [data-loc-img]{height:230px !important;object-position:center 45% !important;}
  [data-loc-grad]{display:none !important;}
  [data-loc-inner]{position:static !important;display:block !important;}
  [data-loc-text]{max-width:none !important;padding:30px 22px 36px !important;}
}

/* =============================================================
   Sekcja Lokale
   ============================================================= */

#lokale {
  scroll-margin-top: 80px;
  background: #ffffff; /* jasne tło jak sekcja Wizualizacje */
  color: #393431;
  padding: 120px 40px;
}

.lokale-inner {
  max-width: 1280px;
  margin: 0 auto;
}

.lokale-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.lokale-eyebrow-line {
  width: 34px;
  height: 1px;
  background: #b08d57;
  flex-shrink: 0;
}

.lokale-eyebrow-text {
  letter-spacing: .32em;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  color: #b08d57;
}

.lokale-heading {
  margin: 0 0 16px;
  font-weight: 400;
  font-size: clamp(30px, 3.4vw, 46px);
  line-height: 1.1;
  color: #393431;
}

.lokale-heading b { font-weight: 700; }

.lokale-sold-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  border: 1px solid #b08d57;
  color: #b08d57;
  letter-spacing: .16em;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 48px;
}

.lokale-sold-badge-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #b08d57;
  flex-shrink: 0;
}

.lokale-wrapper { overflow-x: auto; }

#lok-tabela {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

#lok-tabela th {
  text-align: left;
  padding: 10px 16px;
  font-size: 0.68rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #8a827a;
  border-bottom: 1px solid rgba(57,52,49,.12);
  white-space: nowrap;
}

#lok-tabela td {
  padding: 16px 16px;
  border-bottom: 1px solid rgba(57,52,49,.08);
  vertical-align: middle;
  color: #5c554f;
}

#lok-tabela tbody tr { transition: background .12s; }
#lok-tabela tbody tr:hover { background: rgba(57,52,49,.04); }

.td-nr { font-weight: 700; color: #393431; font-size: .95rem; letter-spacing: .04em; }
.td-metr { font-variant-numeric: tabular-nums; }

.sbadge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 600;
  white-space: nowrap;
}
.sbadge::before {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}
.sbadge-dostepne   { background: rgba(76,175,125,.12);  color: #2e7d52; }
.sbadge-rezerwacja { background: rgba(176,141,87,.15);  color: #8a6020; }
.sbadge-sprzedane  { background: rgba(57,52,49,.08);    color: #8a827a; }

.btn-plan {
  display: inline-block;
  padding: 5px 13px;
  border: 1px solid rgba(57,52,49,.2);
  border-radius: 4px;
  color: #8a827a;
  font-size: .76rem;
  text-decoration: none;
  transition: all .18s;
  white-space: nowrap;
}
.btn-plan:hover { border-color: #b08d57; color: #b08d57; text-decoration: none; }

.lok-state {
  text-align: center;
  padding: 52px 16px;
  color: #8a827a;
  font-size: .9rem;
}

.lok-spinner {
  display: inline-block;
  width: 16px; height: 16px;
  border: 2px solid rgba(57,52,49,.1);
  border-top-color: #b08d57;
  border-radius: 50%;
  animation: lspin .65s linear infinite;
  vertical-align: middle;
  margin-right: 8px;
}
@keyframes lspin { to { transform: rotate(360deg); } }

@media (max-width:980px) { #lokale { padding: 84px 22px; } }
@media (max-width:600px) {
  #lokale { padding: 60px 18px; }
  #lok-tabela th:nth-child(3),
  #lok-tabela td:nth-child(3) { display: none; }
}
