/* ============================================================
   sielnica.css — predajná landing page „Stavebné pozemky Liptovská
   Sielnica – Zelené údolie" (Meta lead kampaň, kupujúci).
   Dopĺňa nehnutelnost/detail.css + lp.css + ads.css.
   ============================================================ */

/* ---------- hero: video · text · formulár ---------- */
.sl-hero .lead-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,60px)}
@media(min-width:1180px){
  .sl-hero .lead-card{grid-template-columns:236px minmax(0,1fr) minmax(320px,.95fr);align-items:start}
}
@media(max-width:900px){.sl-hero .lead-card{grid-template-columns:1fr;gap:26px}}

.sl-hero .eyebrow{display:block;line-height:1.6}
.sl-hero .eyebrow .dot{display:inline-block;vertical-align:middle;margin:-2px 10px 0 0;width:8px;height:8px;border-radius:50%;background:#7AD0A1;box-shadow:0 0 0 4px rgba(122,208,161,.18);animation:blink 2.2s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
.sl-hero h1{font-size:clamp(1.9rem,3.5vw,2.9rem);font-weight:600;line-height:1.06;letter-spacing:-.022em;margin-top:14px;color:#fff}
.sl-hero h1 .it{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
.sl-hero .lc-sub{max-width:46ch}
.sl-hero .lc-phone{margin-top:18px}
@media(max-width:900px){.sl-hero .lc-phone{display:none}}

/* rýchle fakty pod perexom */
.sl-facts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px;list-style:none;padding:0}
.sl-facts li{display:flex;gap:11px;align-items:center;padding:12px 14px;border-radius:12px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);font-size:.86rem;line-height:1.3;color:#DCE3E4}
.sl-facts li b{display:block;color:#fff;font-size:1.02rem;font-weight:600;letter-spacing:-.01em}
.sl-facts li svg{width:20px;height:20px;flex:none;stroke:#8FA3AD;fill:none;stroke-width:1.7}
@media(max-width:440px){.sl-facts{grid-template-columns:1fr}}

/* vertikálne video v heroi (na desktope 1. stĺpec, na mobile skryté —
   dole má vlastnú sekciu) */
.sl-reel{position:relative;aspect-ratio:9/16;border-radius:18px;overflow:hidden;background:#0b1a22;
  box-shadow:0 30px 60px -30px rgba(0,0,0,.7);display:none}
@media(min-width:1180px){.sl-reel{display:block}}
.sl-reel video{width:100%;height:100%;object-fit:cover;display:block}
.sl-reel .sr-tag{position:absolute;left:12px;top:12px;font-size:.66rem;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:#fff;background:rgba(6,20,27,.62);backdrop-filter:blur(6px);padding:7px 11px;border-radius:999px}
.sr-sound{position:absolute;right:12px;bottom:12px;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.35);
  background:rgba(6,20,27,.6);backdrop-filter:blur(6px);color:#fff;cursor:pointer;display:grid;place-items:center;transition:background .25s,transform .3s}
.sr-sound:hover{background:rgba(255,255,255,.2);transform:scale(1.06)}
.sr-sound svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:1.8}
.sr-sound .on{display:none}
.sr-sound.is-on .off{display:none}
.sr-sound.is-on .on{display:block}

/* formulár: 2 selecty vedľa seba */
.sl-hero .ads-form .f2,.sl-cta .ads-form .f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.sl-hero .ads-form .f2,.sl-cta .ads-form .f2{grid-template-columns:1fr}}
.sl-form-title{font-family:var(--serif);font-weight:400;font-size:1.45rem;color:#fff;margin-bottom:4px;letter-spacing:-.01em}
.sl-form-sub{font-size:.86rem;color:#8FA3AD;margin-bottom:18px;line-height:1.5}
.ads-form-wrap .lead-ok{padding:26px 6px}

/* ---------- cenové pásma ---------- */
.tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:clamp(28px,3.4vw,46px)}
@media(max-width:860px){.tier-grid{grid-template-columns:1fr}}
.tier{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r-sm);padding:28px 26px 26px;
  display:flex;flex-direction:column;gap:6px;overflow:hidden;
  transition:transform .45s cubic-bezier(.22,1,.36,1),border-color .35s,box-shadow .45s}
.tier:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:0 26px 44px -30px rgba(17,33,45,.5)}
.tier .tz{font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.tier .tp{font-family:var(--serif);font-size:clamp(2.2rem,3.6vw,3rem);letter-spacing:-.02em;line-height:1;margin-top:8px}
.tier .tp small{font-family:var(--sans);font-size:.95rem;color:var(--ink-2);letter-spacing:0;margin-left:4px}
.tier .tm{font-size:.95rem;color:var(--ink);font-weight:600;margin-top:10px}
.tier .td{font-size:.9rem;color:var(--ink-2);line-height:1.55}
.tier .tfrom{margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-size:.86rem;color:var(--ink-2)}
.tier .tfrom b{color:var(--ink);font-weight:600;font-size:1.05rem;display:block}
.tier.hl{background:var(--dark);color:#fff;border-color:var(--dark)}
.tier.hl .tz,.tier.hl .td,.tier.hl .tfrom,.tier.hl .tp small{color:#B9C4C9}
.tier.hl .tm,.tier.hl .tfrom b{color:#fff}
.tier.hl .tfrom{border-color:rgba(255,255,255,.14)}
.tier.hl .badge{position:absolute;right:16px;top:16px;font-size:.62rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  background:#fff;color:var(--ink);padding:6px 10px;border-radius:999px}
.tier-note{margin-top:16px;font-size:.86rem;color:var(--ink-2);line-height:1.6;max-width:70ch}

/* hypotéka pás */
.sl-hypo{display:grid;grid-template-columns:1fr auto;gap:clamp(18px,3vw,40px);align-items:center;
  margin-top:clamp(22px,3vw,34px);padding:clamp(20px,2.6vw,30px) clamp(22px,3vw,34px);border-radius:18px;
  background:var(--bg-2);border:1px solid var(--line)}
@media(max-width:760px){.sl-hypo{grid-template-columns:1fr}}
.sl-hypo h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.25rem,2vw,1.6rem);letter-spacing:-.01em;margin-bottom:6px}
.sl-hypo p{font-size:.92rem;color:var(--ink-2);line-height:1.6;max-width:60ch}
.sl-hypo .hn{display:flex;gap:clamp(18px,3vw,36px)}
.sl-hypo .hn div{text-align:center}
.sl-hypo .hn b{display:block;font-family:var(--serif);font-size:clamp(1.6rem,2.6vw,2.2rem);letter-spacing:-.02em;line-height:1}
.sl-hypo .hn span{font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);display:block;margin-top:8px}

/* ---------- video + galéria ---------- */
.sl-media{display:grid;grid-template-columns:minmax(240px,300px) 1fr;gap:14px;margin-top:clamp(26px,3vw,40px);align-items:stretch}
@media(max-width:760px){.sl-media{grid-template-columns:1fr}}
.sl-media .sl-reel{display:block;aspect-ratio:9/16;box-shadow:none;border:1px solid var(--line)}
@media(max-width:760px){.sl-media .sl-reel{max-width:340px;margin:0 auto;width:100%}}
.sl-gal{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:10px}
.sl-gal button{border:none;padding:0;background:var(--bg-2);border-radius:14px;overflow:hidden;cursor:zoom-in;position:relative;aspect-ratio:4/3}
.sl-gal img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.sl-gal button:hover img{transform:scale(1.04)}
.sl-gal .more{position:absolute;inset:0;display:grid;place-items:center;background:rgba(6,20,27,.55);color:#fff;
  font-family:var(--serif);font-size:1.6rem}
.sl-gal-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:10px}
@media(max-width:760px){.sl-gal-row{grid-template-columns:repeat(3,1fr)}}
.sl-gal-row button{border:none;padding:0;background:var(--bg-2);border-radius:12px;overflow:hidden;cursor:zoom-in;aspect-ratio:4/3}
.sl-gal-row img{width:100%;height:100%;object-fit:cover;display:block}

/* mapa parciel */
.sl-parcels{margin-top:clamp(26px,3vw,40px);display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(18px,3vw,40px);align-items:center}
@media(max-width:860px){.sl-parcels{grid-template-columns:1fr}}
.sl-parcels button{border:none;padding:0;background:none;cursor:zoom-in;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line)}
.sl-parcels img{width:100%;display:block}
.sl-parcels h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.4rem,2.4vw,1.9rem);letter-spacing:-.01em;line-height:1.15}
.sl-parcels p{margin-top:12px;color:var(--ink-2);line-height:1.65;font-size:.96rem}
.sl-parcels .pillbtn{margin-top:20px}

/* ---------- lokalita ---------- */
.sl-loc{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(18px,3vw,40px);margin-top:clamp(26px,3vw,40px);align-items:start}
@media(max-width:860px){.sl-loc{grid-template-columns:1fr}}
.sl-loc p{color:var(--ink-2);line-height:1.66;font-size:.98rem}
.sl-loc p+p{margin-top:12px}
.sl-dist{list-style:none;padding:0;margin-top:20px;border-top:1px solid var(--line)}
.sl-dist li{display:flex;justify-content:space-between;gap:14px;padding:11px 2px;border-bottom:1px solid var(--line);font-size:.93rem}
.sl-dist li span{color:var(--ink-2)}
.sl-dist li b{font-weight:600;white-space:nowrap}
.sl-map{border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3;background:var(--bg-2)}
.sl-map iframe{width:100%;height:100%;border:0;display:block}

/* ---------- Jakub blok ---------- */
.sl-jakub{display:grid;grid-template-columns:auto 1fr;gap:clamp(18px,3vw,36px);align-items:center;margin-top:clamp(26px,3vw,40px);
  padding:clamp(22px,3vw,34px);border-radius:var(--r-sm);background:var(--card);border:1px solid var(--line)}
@media(max-width:600px){.sl-jakub{grid-template-columns:1fr}}
.sl-jakub img{width:120px;height:120px;border-radius:50%;object-fit:cover;object-position:top}
.sl-jakub p{font-family:var(--serif);font-size:clamp(1.05rem,1.7vw,1.25rem);line-height:1.5}
.sl-jakub .who{margin-top:12px;font-size:.84rem;color:var(--ink-2)}
.sl-jakub .who b{display:block;color:var(--ink);font-size:.94rem}

@media(prefers-reduced-motion:reduce){
  .sl-hero .eyebrow .dot{animation:none}
  .tier,.sl-gal img,.sr-sound{transition:none}
}