:root{
  --g:#2A7D4F;--g1:#3CAB6E;--g2:#1D5C38;
  --gbg:rgba(42,125,79,.09);--gbdr:rgba(42,125,79,.22);
  --bg:#F4F6F3;--bg2:#FFFFFF;--bg3:#ECF0EB;
  --card:#FFFFFF;--c2:#EFF3EE;
  --line:rgba(0,0,0,.08);--ln2:rgba(0,0,0,.04);
  --tx:#0E1812;--tx2:#364840;--tx3:#697D72;
  --ok:#10B981;--okb:rgba(16,185,129,.11);
  --wa:#F59E0B;--wab:rgba(245,158,11,.11);
  --er:#EF4444;--erb:rgba(239,68,68,.09);
  --bl:#2563EB;--blb:rgba(37,99,235,.09);
  --vi:#7C3AED;
  --nav:rgba(244,246,243,.92);
  --sh:0 2px 14px rgba(0,0,0,.07);
  --sh2:0 8px 36px rgba(0,0,0,.11);
  --r:14px;
}
[data-theme="dark"]{
  --bg:#0B1510;--bg2:#101D13;--bg3:#141F17;
  --card:#141F17;--c2:#1A2A1E;
  --line:rgba(255,255,255,.08);--ln2:rgba(255,255,255,.04);
  --tx:#E6EEE8;--tx2:#A3B9AA;--tx3:#5C7464;
  --nav:rgba(11,21,16,.92);
  --gbg:rgba(42,125,79,.13);--gbdr:rgba(42,125,79,.28);
  --sh:0 2px 18px rgba(0,0,0,.4);--sh2:0 8px 44px rgba(0,0,0,.55);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Outfit',sans-serif;background:var(--bg);color:var(--tx);overflow-x:hidden;-webkit-font-smoothing:antialiased;transition:background .4s,color .4s;}
h1,h2,h3{font-family:'Fraunces',serif;line-height:1.12;}
a{text-decoration:none;color:inherit;}
::-webkit-scrollbar{width:3px;}
::-webkit-scrollbar-thumb{background:var(--g);border-radius:2px;}

/* NAV */
nav{
  position:fixed;inset:0 0 auto;z-index:300;height:58px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 clamp(14px,4vw,52px);
  background:var(--nav);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
  border-bottom:1px solid var(--line);transition:all .35s;
}
.nlogo{display:flex;align-items:center;gap:10px;}
.nmark{
  width:32px;height:32px;border-radius:8px;flex-shrink:0;
  background:linear-gradient(135deg,var(--g2),var(--g1));
  display:flex;align-items:center;justify-content:center;font-size:16px;
  box-shadow:0 0 14px rgba(42,125,79,.28);
}
.nname{font-size:16px;font-weight:700;letter-spacing:-.3px;}
.ntag{font-size:9px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--g);background:var(--gbg);padding:2px 7px;border-radius:4px;}
@media(max-width:460px){.ntag{display:none;}}
.nlinks{display:flex;gap:22px;}
.nlinks a{font-size:13px;font-weight:500;color:var(--tx3);transition:color .2s;}
.nlinks a:hover{color:var(--g);}
.nl-sep{color:var(--line);font-size:14px;user-select:none;}
.nl-scene{font-weight:700!important;color:var(--tx2)!important;}
.nl-active{color:var(--g)!important;}
.nl-home{color:var(--tx3);}
@media(max-width:700px){.nlinks{display:none;}}
.nright{display:flex;align-items:center;gap:8px;}
.tbtn{
  width:34px;height:34px;border-radius:8px;border:1px solid var(--line);
  background:var(--card);display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:15px;transition:all .2s;flex-shrink:0;
}
.tbtn:hover{background:var(--gbg);border-color:var(--g);}
.nbtn{
  background:var(--g);color:#fff;padding:8px 16px;border-radius:8px;
  font-family:'Outfit',sans-serif;font-size:13px;font-weight:600;border:none;
  cursor:pointer;white-space:nowrap;transition:all .2s;
  box-shadow:0 0 16px rgba(42,125,79,.28);
}
.nbtn:hover{background:var(--g2);transform:translateY(-1px);}

/* HERO */
.hero{
  position:relative;min-height:100svh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;overflow:hidden;
  background-color:#0f1e14;
}
.hero-bg{
  position:absolute;inset:0;z-index:0;
  background-size:cover;background-position:center;
  background-color:#0f1e14;
  transition:background-image .6s ease, opacity .6s ease;
}
.hero-bg::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(to bottom,
    rgba(0,0,0,.45) 0%,
    rgba(0,0,0,.25) 40%,
    rgba(0,0,0,.55) 100%);
}
.hero-content{
  position:relative;z-index:1;
  padding:88px clamp(16px,6vw,80px) 60px;
  max-width:860px;
}
.h-pill{
  display:inline-flex;align-items:center;gap:7px;
  background:rgba(255,255,255,.15);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.3);
  padding:6px 16px;border-radius:40px;
  font-size:12px;font-weight:600;color:#fff;margin-bottom:22px;
}
.pdot{width:6px;height:6px;border-radius:50%;background:var(--g1);animation:pd 2s ease-in-out infinite;}
@keyframes pd{0%,100%{opacity:1;}50%{opacity:.2;}}
.hero h1{
  font-size:clamp(36px,6.5vw,78px);letter-spacing:-2px;
  color:#fff;margin-bottom:18px;text-shadow:0 2px 20px rgba(0,0,0,.3);
}
.hero h1 em{font-style:italic;color:var(--g1);}
.hero-sub{
  font-size:clamp(14px,2vw,18px);font-weight:400;
  color:rgba(255,255,255,.82);line-height:1.75;
  max-width:560px;margin:0 auto 32px;
}
.hbtns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:44px;}
.btn{display:inline-flex;align-items:center;gap:6px;font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;padding:12px 24px;border-radius:10px;cursor:pointer;transition:all .25s;border:none;}
.btn-g{background:var(--g);color:#fff;box-shadow:0 0 24px rgba(42,125,79,.4);}
.btn-g:hover{background:var(--g2);transform:translateY(-2px);box-shadow:0 6px 28px rgba(42,125,79,.55);}
.btn-w{background:rgba(255,255,255,.15);color:#fff;backdrop-filter:blur(8px);border:1.5px solid rgba(255,255,255,.35);}
.btn-w:hover{background:rgba(255,255,255,.25);border-color:rgba(255,255,255,.6);}
.hstats{
  display:inline-flex;border:1px solid rgba(255,255,255,.2);border-radius:13px;
  background:rgba(0,0,0,.25);backdrop-filter:blur(12px);overflow:hidden;flex-wrap:wrap;
}
.hst{padding:13px clamp(12px,2.5vw,24px);border-right:1px solid rgba(255,255,255,.15);text-align:center;}
.hst:last-child{border-right:none;}
.hst .n{font-size:clamp(17px,2.5vw,26px);font-weight:800;color:#fff;line-height:1;}
.hst .l{font-size:10px;color:rgba(255,255,255,.65);margin-top:3px;}
/* night mode badge */
.night-badge{
  position:absolute;bottom:24px;right:24px;z-index:2;
  display:flex;align-items:center;gap:7px;
  background:rgba(0,0,0,.4);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.15);
  padding:7px 13px;border-radius:8px;
  font-size:11px;color:rgba(255,255,255,.75);
  transition:opacity .6s;
}
.night-badge.hidden{opacity:0;pointer-events:none;}
/* scroll hint */
.scroll-hint{
  position:absolute;bottom:28px;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  font-size:10px;color:rgba(255,255,255,.5);letter-spacing:2px;text-transform:uppercase;
  animation:sh 2.4s ease-in-out infinite;z-index:2;
}
@keyframes sh{0%,100%{transform:translateX(-50%) translateY(0);}50%{transform:translateX(-50%) translateY(-6px);}}
.sh-arr{width:16px;height:16px;border-right:1.5px solid rgba(255,255,255,.4);border-bottom:1.5px solid rgba(255,255,255,.4);transform:rotate(45deg);}

/* GALLERY */
#galerija{padding:72px clamp(14px,4vw,52px);background:var(--bg2);}
.gal-inner{max-width:1100px;margin:0 auto;}
.gal-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  grid-template-rows:220px 220px;
  gap:10px;margin-top:36px;border-radius:16px;overflow:hidden;
}
@media(max-width:680px){
  .gal-grid{grid-template-columns:1fr 1fr;grid-template-rows:160px 160px 160px;}
  .gal-item:first-child{grid-column:span 2;grid-row:span 1;}
}
.gal-item{
  position:relative;overflow:hidden;cursor:pointer;background:var(--c2);
}
.gal-item:first-child{grid-row:span 2;}
.gal-item img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease;}
.gal-item:hover img{transform:scale(1.05);}
.gal-overlay{
  position:absolute;inset:0;background:rgba(42,125,79,.0);
  display:flex;align-items:center;justify-content:center;
  transition:background .3s;
}
.gal-item:hover .gal-overlay{background:rgba(42,125,79,.15);}
.gal-label{
  position:absolute;bottom:8px;left:8px;
  background:rgba(255,255,255,.88);backdrop-filter:blur(6px);
  padding:4px 10px;border-radius:6px;
  font-size:10px;font-weight:700;color:var(--tx2);
  border:1px solid rgba(0,0,0,.07);
}
[data-theme="dark"] .gal-label{background:rgba(0,0,0,.6);color:rgba(255,255,255,.85);}

/* lightbox */
.lightbox{
  position:fixed;inset:0;z-index:500;
  background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .3s;
}
.lightbox.open{opacity:1;pointer-events:all;}
.lb-img{max-width:90vw;max-height:85vh;border-radius:10px;object-fit:contain;box-shadow:0 20px 60px rgba(0,0,0,.5);}
.lb-close{
  position:absolute;top:20px;right:24px;
  width:40px;height:40px;border-radius:50%;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;
  font-size:18px;cursor:pointer;color:#fff;
  transition:background .2s;
}
.lb-close:hover{background:rgba(255,255,255,.25);}
.lb-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:44px;height:44px;border-radius:50%;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;
  font-size:20px;cursor:pointer;color:#fff;transition:background .2s;
}
.lb-nav:hover{background:rgba(255,255,255,.25);}
.lb-prev{left:20px;}
.lb-next{right:20px;}
.lb-caption{
  position:absolute;bottom:24px;left:50%;transform:translateX(-50%);
  background:rgba(0,0,0,.55);backdrop-filter:blur(8px);
  padding:7px 18px;border-radius:8px;
  font-size:13px;color:rgba(255,255,255,.85);white-space:nowrap;
}

/* SECTIONS COMMON */
.sec{padding:72px clamp(14px,4vw,52px);}
.si{max-width:1100px;margin:0 auto;}
.eyebrow{font-size:10.5px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--g);margin-bottom:13px;}
.sh2{font-size:clamp(24px,3.5vw,44px);letter-spacing:-1px;margin-bottom:10px;}
.sp{font-family:'Outfit',sans-serif;font-size:14.5px;color:var(--tx3);max-width:500px;line-height:1.72;}

/* WHAT WE OFFER */
.offer-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:14px;margin-top:40px;
}
.oc{
  background:var(--card);border:1px solid var(--line);
  border-radius:var(--r);padding:22px;transition:all .3s;
  position:relative;overflow:hidden;
}
.oc::before{
  content:'';position:absolute;inset:0;opacity:0;
  transition:opacity .3s;pointer-events:none;
  background:radial-gradient(ellipse at 0 0,var(--gbg) 0%,transparent 70%);
}
.oc:hover{border-color:var(--gbdr);transform:translateY(-4px);box-shadow:var(--sh2);}
.oc:hover::before{opacity:1;}
.oc-num{font-size:10px;font-weight:700;letter-spacing:1px;color:var(--g);margin-bottom:10px;font-family:'Outfit',monospace;}
.oc-icon{font-size:26px;margin-bottom:12px;display:block;}
.oc h3{font-family:'Outfit',sans-serif;font-size:16px;font-weight:700;margin-bottom:6px;}
.oc p{font-family:'Outfit',sans-serif;font-size:13px;color:var(--tx3);line-height:1.65;}
.oc-pill{display:inline-block;margin-top:11px;font-size:9.5px;font-weight:700;letter-spacing:.5px;padding:3px 9px;border-radius:5px;}
.pg{background:var(--gbg);color:var(--g);}
.po{background:var(--okb);color:var(--ok);}
.pv{background:rgba(124,58,237,.1);color:var(--vi);}
.pw{background:var(--wab);color:var(--wa);}
.pb{background:var(--blb);color:var(--bl);}

/* Nav: Naselje / Zgrada switch */
.mode-switch{display:inline-flex;background:var(--c2);border:1px solid var(--line);border-radius:8px;padding:2px;gap:0;}
.mode-switch-opt{padding:6px 12px;border-radius:6px;font-size:12px;font-weight:600;color:var(--tx3);text-decoration:none;transition:all .2s;}
.mode-switch-opt:hover{color:var(--tx2);background:var(--card);}
.mode-switch-opt.on,.mode-switch-opt[aria-current="page"]{background:var(--g);color:#fff;}
@media(max-width:520px){.mode-switch-opt{padding:5px 8px;font-size:11px;}}
.page-zgrada .flist{display:none;}

/* Landing: scenario cards */
.scenario-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px;}
@media(max-width:760px){.scenario-grid{grid-template-columns:1fr;}}
.scenario-card{display:block;background:var(--card);border:2px solid var(--line);border-radius:var(--r);padding:28px;text-decoration:none;color:inherit;transition:all .3s;}
.scenario-card:hover{border-color:var(--g);box-shadow:var(--sh2);transform:translateY(-4px);}
.scenario-first{border-color:var(--gbdr);}
.scenario-first:hover{border-color:var(--g);}
.scenario-icon{font-size:42px;margin-bottom:12px;display:block;}
.scenario-title{font-family:'Fraunces',serif;font-size:22px;margin-bottom:10px;}
.scenario-desc{font-size:14px;color:var(--tx3);line-height:1.65;margin-bottom:16px;}
.scenario-list{list-style:none;padding:0;margin:0 0 20px;font-size:13px;color:var(--tx2);line-height:1.8;}
.scenario-list li::before{content:'✓ ';color:var(--g);font-weight:700;}
.scenario-cta{font-size:13px;font-weight:700;color:var(--g);}
.scenario-card:hover .scenario-cta{text-decoration:underline;}

/* SETTLEMENT MAP */
.nas-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px;align-items:start;}
@media(max-width:680px){.nas-grid{grid-template-columns:1fr;}}
.map-box{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;}
.map-ttl{font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--tx3);margin-bottom:14px;}
/* aerial image as map */
.aerial-map{
  border-radius:10px;overflow:hidden;position:relative;cursor:pointer;
  border:1px solid var(--line);
}
.aerial-map img{width:100%;display:block;transition:transform .3s;}
.aerial-map:hover img{transform:scale(1.02);}
.aerial-overlay{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to bottom,transparent 50%,rgba(0,0,0,.3) 100%);
}
/* villa pin dots */
.villa-pins{position:absolute;inset:0;}
.vpin{
  position:absolute;
  width:22px;height:22px;border-radius:50%;
  background:var(--g);border:2px solid #fff;
  display:flex;align-items:center;justify-content:center;
  font-size:8px;font-weight:700;color:#fff;
  cursor:pointer;transition:all .2s;
  box-shadow:0 2px 8px rgba(0,0,0,.3);
  transform:translate(-50%,-50%);
}
.vpin:hover{transform:translate(-50%,-50%) scale(1.3);background:var(--g2);}
.vpin.has-issue{background:var(--wa);}
.vpin-label{
  position:absolute;top:-20px;left:50%;transform:translateX(-50%);
  background:rgba(0,0,0,.7);color:#fff;
  font-size:7px;font-weight:700;padding:2px 5px;border-radius:3px;
  white-space:nowrap;opacity:0;transition:opacity .2s;pointer-events:none;
}
.vpin:hover .vpin-label{opacity:1;}

/* villa detail card */
.vgrid-mini{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:8px;}
.vb{background:var(--card);border:1.5px solid var(--line);border-radius:7px;padding:6px 4px;cursor:pointer;transition:all .2s;text-align:center;}
.vb:hover{border-color:var(--g);transform:scale(1.06);}
.vb.act{border-color:var(--g);background:var(--gbg);}
.vb-id{font-size:8px;font-weight:700;color:var(--tx3);margin-bottom:2px;}
.vb-ic{font-size:16px;display:block;line-height:1;margin-bottom:2px;}
.vb-st{font-size:7px;font-weight:700;padding:1px 4px;border-radius:3px;}
.sok{background:var(--okb);color:var(--ok);}
.sw{background:var(--wab);color:var(--wa);}
.park-r{background:var(--gbg);border-radius:7px;padding:6px 10px;display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:var(--g);border:1px solid var(--gbdr);}
.vinfo{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;display:flex;flex-direction:column;gap:12px;}
.vi-head{display:flex;align-items:center;gap:10px;}
.vi-ic{font-size:26px;}
.vi-nm{font-size:18px;font-weight:700;letter-spacing:-.3px;}
.vi-addr{font-size:11px;color:var(--tx3);}
.ulist{display:flex;flex-direction:column;gap:5px;}
.ur{display:flex;align-items:center;gap:8px;background:var(--c2);border-radius:8px;padding:9px 11px;cursor:pointer;transition:all .2s;border:1px solid transparent;}
.ur:hover{border-color:var(--g);background:var(--gbg);}
.ur-fl{font-size:10px;font-weight:700;color:var(--tx3);width:36px;}
.ur-nm{flex:1;font-size:13px;font-weight:600;}
.ur-ar{font-size:11px;color:var(--tx3);}
.ur-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}

/* DEMO */
.demo-lay{display:grid;grid-template-columns:240px 1fr;gap:24px;align-items:start;}
@media(max-width:660px){.demo-lay{grid-template-columns:1fr;}}
.phone-wrap{position:sticky;top:70px;display:flex;justify-content:center;}
.phone{background:#111820;border-radius:34px;padding:8px;box-shadow:var(--sh2);width:230px;}
.ph-scr{background:var(--bg);border-radius:27px;overflow:hidden;min-height:470px;}
.ph-notch{width:64px;height:18px;background:#111820;border-radius:0 0 10px 10px;margin:0 auto;}
.app-hdr{background:var(--g);padding:9px 13px 7px;display:flex;align-items:center;justify-content:space-between;}
.app-nm{font-size:12px;font-weight:700;color:#fff;}
.app-bell-w{position:relative;font-size:16px;}
.bell-d{position:absolute;top:-3px;right:-3px;width:7px;height:7px;border-radius:50%;background:#fff;border:1.5px solid var(--g);}
.app-usr{background:linear-gradient(180deg,var(--g),var(--g2));padding:8px 13px;display:flex;align-items:center;gap:7px;}
.app-av{width:27px;height:27px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:12px;}
.app-hi{font-size:9px;color:rgba(255,255,255,.7);}
.app-un{font-size:12px;font-weight:700;color:#fff;}
.app-bd{padding:9px;}
.atabs{display:flex;gap:2px;background:var(--c2);border-radius:8px;padding:3px;margin-bottom:9px;}
.at{flex:1;padding:5px 2px;border-radius:6px;border:none;background:transparent;cursor:pointer;font-family:'Outfit',sans-serif;font-size:9px;font-weight:600;color:var(--tx3);transition:all .2s;text-align:center;}
.at.on{background:var(--g);color:#fff;}
.apn{display:none;}
.apn.on{display:block;}
.ac{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 10px;margin-bottom:6px;}
.ac-r{display:flex;align-items:center;gap:6px;}
.ac-i{font-size:15px;flex-shrink:0;}
.ac-t{font-size:11px;font-weight:700;}
.ac-s{font-size:9px;color:var(--tx3);margin-top:1px;}
.ml{margin-left:auto;}
.ab{font-size:8px;font-weight:700;padding:2px 6px;border-radius:4px;}
.ab-ok{background:var(--okb);color:var(--ok);}
.ab-w{background:var(--wab);color:var(--wa);}
.ab-e{background:var(--erb);color:var(--er);}
.ab-b{background:var(--blb);color:var(--bl);}
.ab-tl{background:rgba(37,99,235,.12);color:var(--bl);}
.ac-tl{border-color:rgba(37,99,235,.25);background:linear-gradient(135deg, rgba(37,99,235,.04), rgba(42,125,79,.06));}
.ac-tl .ac-t{color:var(--bl);}
.ac-earn{border-color:var(--gbdr);background:var(--gbg);}
.ac-earn .ac-t{color:var(--g);}
.btn-tl{background:linear-gradient(135deg, var(--bl), #1d4ed8);}
.btn-tl:hover{background:linear-gradient(135deg, #1d4ed8, var(--bl));}
.pbar-w{height:5px;background:var(--line);border-radius:3px;margin-top:5px;overflow:hidden;}
.pbar-f{height:100%;border-radius:3px;background:var(--g);}
.ph-home{height:26px;display:flex;align-items:center;justify-content:center;}
.ph-bar{width:60px;height:3px;background:var(--line);border-radius:2px;}
.btn-xs{width:100%;padding:7px;border-radius:7px;font-family:'Outfit',sans-serif;font-size:10.5px;font-weight:700;border:none;cursor:pointer;background:var(--g);color:#fff;transition:all .2s;margin-top:2px;}
.btn-xs:hover{background:var(--g2);}
.fi{display:flex;gap:7px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--ln2);}
.fi:last-child{border-bottom:none;margin-bottom:0;}
.fav{width:23px;height:23px;border-radius:50%;background:var(--gbg);display:flex;align-items:center;justify-content:center;font-size:10px;flex-shrink:0;}
.fn{font-size:10px;font-weight:700;}
.ft{font-size:8px;color:var(--tx3);}
.fb{font-size:10px;color:var(--tx2);margin-top:2px;line-height:1.4;}
.fr{font-size:9px;color:var(--tx3);margin-top:3px;}
.flist{display:flex;flex-direction:column;gap:11px;}
.fc{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;transition:all .3s;cursor:pointer;}
.fc:hover,.fc.on{border-color:var(--g);background:var(--gbg);transform:translateX(3px);}
.fc-row{display:flex;align-items:flex-start;gap:10px;}
.fc-ico{width:38px;height:38px;border-radius:9px;background:var(--gbg);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0;}
.fc-nm{font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;margin-bottom:3px;}
.fc-dc{font-family:'Outfit',sans-serif;font-size:12px;color:var(--tx3);line-height:1.55;}
.fc-tag{display:inline-block;font-size:9px;font-weight:700;padding:2px 6px;border-radius:3px;background:var(--gbg);color:var(--g);margin-top:4px;letter-spacing:.5px;}

/* STORY */
.tl{position:relative;padding-left:30px;}
.tl::before{content:'';position:absolute;left:7px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--g),rgba(42,125,79,.1));}
.tli{position:relative;margin-bottom:24px;opacity:0;transform:translateX(-12px);transition:all .5s ease;}
.tli.v{opacity:1;transform:none;}
.tl-dot{position:absolute;left:-25px;top:13px;width:10px;height:10px;border-radius:50%;background:var(--g);border:2px solid var(--bg);box-shadow:0 0 8px rgba(42,125,79,.4);}
.tl-t{font-size:10px;font-weight:600;color:var(--g);letter-spacing:1px;margin-bottom:5px;}
.tl-card{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.tl-top{display:flex;align-items:center;gap:8px;padding:11px 14px;}
.tl-em{font-size:17px;}.tl-ti{font-family:'Outfit',sans-serif;font-size:13px;font-weight:700;}
.tl-cols{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);}
.tl-col{padding:10px 14px;}
.tl-col:first-child{border-right:1px solid var(--line);}
.cl{font-size:8.5px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:5px;}
.tl-col.bef .cl{color:var(--er);}
.tl-col.aft .cl{color:var(--ok);}
.ct{font-family:'Outfit',sans-serif;font-size:12px;color:var(--tx2);line-height:1.55;}

/* MODULES */
.mods{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:38px;}
.mc{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;transition:all .3s;}
.mc:hover{border-color:var(--gbdr);transform:translateY(-4px);box-shadow:var(--sh2);}
.mc-i{font-size:20px;margin-bottom:10px;display:block;}
.mc h3{font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;margin-bottom:5px;}
.mc p{font-family:'Outfit',sans-serif;font-size:12px;color:var(--tx3);line-height:1.6;}
.mcp{display:inline-block;margin-top:8px;font-size:9px;font-weight:700;letter-spacing:.5px;padding:2px 7px;border-radius:4px;}
.pc{background:var(--gbg);color:var(--g);}
.pp{background:var(--okb);color:var(--ok);}
.pa{background:rgba(124,58,237,.1);color:var(--vi);}
.pn{background:var(--wab);color:var(--wa);}

/* PLANS */
.plans{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin-top:38px;}
.plan{background:var(--card);border:2px solid var(--line);border-radius:var(--r);overflow:hidden;transition:all .3s;}
.plan:hover{transform:translateY(-4px);box-shadow:var(--sh2);}
.plan.best{border-color:var(--g);box-shadow:0 0 32px rgba(42,125,79,.12);}
.plan-t{padding:16px;text-align:center;border-bottom:1px solid var(--line);}
.pname{font-size:10px;font-weight:700;letter-spacing:2px;margin-bottom:8px;}
.ppr{font-size:27px;font-weight:800;line-height:1;margin-bottom:3px;}
.ppr span{font-size:13px;font-weight:400;color:var(--tx3);}
.pcap{font-size:10px;color:var(--tx3);}
.plan-b{padding:16px;}
.pf{display:flex;align-items:flex-start;gap:6px;font-family:'Outfit',sans-serif;font-size:12.5px;margin-bottom:8px;line-height:1.4;}
.pf .ck{color:var(--ok);flex-shrink:0;}
.pf.dim{color:var(--tx3);}
.pf.dim .ck{opacity:.3;}
.pbtn{width:100%;margin-top:10px;padding:10px;border-radius:8px;font-family:'Outfit',sans-serif;font-size:13px;font-weight:700;border:none;cursor:pointer;transition:all .2s;}
.pb-g{background:var(--g);color:#fff;}
.pb-g:hover{background:var(--g2);}
.pb-o{background:transparent;color:var(--g);border:1.5px solid var(--g);}
.pb-o:hover{background:var(--gbg);}

/* FAQ */
.faq-item{border:1px solid var(--line);border-radius:11px;margin-bottom:7px;overflow:hidden;transition:border-color .2s;}
.faq-item.open{border-color:var(--gbdr);}
.fq{display:flex;justify-content:space-between;align-items:center;padding:15px 17px;cursor:pointer;font-family:'Outfit',sans-serif;font-size:14px;font-weight:600;transition:background .2s;user-select:none;}
.fq:hover{background:var(--gbg);}
.farr{color:var(--tx3);transition:transform .3s;font-size:11px;}
.faq-item.open .farr{transform:rotate(180deg);}
.fa{max-height:0;overflow:hidden;font-family:'Outfit',sans-serif;font-size:13.5px;color:var(--tx3);line-height:1.7;transition:all .32s;padding:0 17px;}
.faq-item.open .fa{max-height:200px;padding:4px 17px 15px;}

/* CTA with park image */
.cta{
  position:relative;padding:80px clamp(14px,4vw,52px);
  text-align:center;overflow:hidden;
}
.cta-bg{
  position:absolute;inset:0;z-index:0;
  background-size:cover;background-position:center;
}
.cta-bg::after{content:'';position:absolute;inset:0;background:rgba(15,30,20,.75);}
.cta-content{position:relative;z-index:1;}
.cta h2{font-size:clamp(24px,4vw,52px);letter-spacing:-1.5px;color:#fff;margin-bottom:12px;}
.cta h2 em{font-style:italic;color:var(--g1);}
.cta p{font-family:'Outfit',sans-serif;font-size:15px;color:rgba(255,255,255,.72);max-width:440px;margin:0 auto 28px;line-height:1.7;}
.cta-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
.btn-wh{background:#fff;color:var(--g2);padding:12px 24px;border-radius:10px;font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;border:none;cursor:pointer;transition:all .2s;}
.btn-wh:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.2);}
.btn-ow{background:transparent;color:#fff;padding:12px 24px;border-radius:10px;font-family:'Outfit',sans-serif;font-size:15px;font-weight:600;border:1.5px solid rgba(255,255,255,.38);cursor:pointer;transition:all .2s;}
.btn-ow:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.65);}

/* FOOTER */
footer{background:var(--bg3);border-top:1px solid var(--line);padding:28px clamp(14px,4vw,52px);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.ft-brand{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;}
.ft-links{display:flex;gap:18px;flex-wrap:wrap;}
.ft-links a{font-size:12px;color:var(--tx3);transition:color .2s;}
.ft-links a:hover{color:var(--g);}
.ft-copy{font-size:11px;color:var(--tx3);}

/* TOAST */
#toast{position:fixed;bottom:18px;right:18px;z-index:999;background:var(--card);border:1px solid var(--g);border-radius:11px;padding:10px 14px;display:flex;align-items:center;gap:7px;font-family:'Outfit',sans-serif;font-size:13px;font-weight:500;box-shadow:var(--sh2);transform:translateY(70px);opacity:0;transition:all .3s cubic-bezier(.34,1.56,.64,1);max-width:280px;pointer-events:none;}
#toast.show{transform:translateY(0);opacity:1;}

/* REVEAL */
.rv{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease;}
.rvl{opacity:0;transform:translateX(-14px);transition:opacity .55s ease,transform .55s ease;}
.rv.v,.rvl.v{opacity:1;transform:none;}


/* Hero night mode — tamniji overlay umjesto zamjene slike */
.hero.hero-night .hero-bg::after{
  background:linear-gradient(to bottom,
    rgba(0,0,0,.65) 0%,
    rgba(0,0,0,.45) 40%,
    rgba(0,0,0,.72) 100%);
}

/* LANDING SVG HERO */
.hero-svg-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.hero-landing{background:#080f0a !important;}
.hero-landing .hero-bg{background:none !important;}
.hero-landing .hero-bg::after{display:none;}

/* LANDING HERO */
.hero-landing{min-height:100svh;}
.hero-content-landing{padding-bottom:20px;}
.landing-feat-pills{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-top:20px;margin-bottom:24px;}
.lfp{background:rgba(255,255,255,.13);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.22);color:#fff;font-size:11px;font-weight:600;padding:5px 12px;border-radius:20px;}

/* LANDING DEMO CARDS (inside hero) */
.landing-demo-cards{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.ldc-card{background:rgba(255,255,255,.1);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1.5px solid rgba(255,255,255,.22);border-radius:18px;padding:18px 20px;text-decoration:none;color:#fff;display:flex;flex-direction:column;gap:8px;min-width:220px;max-width:280px;flex:1;transition:all .28s;}
.ldc-card:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.45);transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.3);}
.ldc-header{display:flex;align-items:center;gap:11px;}
.ldc-icon{font-size:28px;}
.ldc-type{font-size:9px;font-weight:800;letter-spacing:1.8px;text-transform:uppercase;color:rgba(255,255,255,.6);}
.ldc-name{font-size:16px;font-weight:800;letter-spacing:-.3px;}
.ldc-meta{font-size:11px;color:rgba(255,255,255,.6);}
.ldc-features{display:flex;flex-wrap:wrap;gap:5px;}
.ldc-features span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:6px;font-size:10px;font-weight:600;padding:3px 8px;color:rgba(255,255,255,.85);}
.ldc-cta{font-size:12px;font-weight:700;color:var(--g1);margin-top:4px;}

/* DEMO PICK GRID (primjena sekcija) */
.demo-pick-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
@media(max-width:640px){.demo-pick-grid{grid-template-columns:1fr;}}
.demo-pick-card{background:var(--card);border:2px solid var(--line);border-radius:20px;text-decoration:none;color:var(--tx);overflow:hidden;display:flex;flex-direction:column;transition:all .3s;}
.demo-pick-card:hover{border-color:var(--g);transform:translateY(-5px);box-shadow:var(--sh2);}
.dpc-img{height:180px;background-size:cover;background-position:center;}
.dpc-img-zgrada{background-image:url('https://www.botinec-living.com/wp-content/uploads/2025/07/A_VRayCam001-2-2x-scaled.jpg');background-position:center 40%;}
.dpc-img-naselje{background-image:url('assets/hero-new-east-residence.png');}
.dpc-body{padding:22px 24px;display:flex;flex-direction:column;gap:10px;flex:1;}
.dpc-badge{font-size:9.5px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--g);padding:4px 10px;background:var(--c2);border-radius:6px;display:inline-block;align-self:flex-start;}
.dpc-badge-n{color:#7c6ed4;background:rgba(124,110,212,.1);}
.dpc-title{font-family:'Fraunces',serif;font-size:24px;font-weight:600;margin:0;letter-spacing:-.3px;}
.dpc-desc{font-size:12.5px;color:var(--tx3);margin:0;}
.dpc-stats{display:flex;gap:14px;}
.dps{text-align:center;}
.dps-n{font-size:22px;font-weight:800;letter-spacing:-.5px;color:var(--g);}
.dps-l{font-size:10px;color:var(--tx3);font-weight:500;}
.dpc-tags{display:flex;flex-wrap:wrap;gap:6px;}
.dpc-tags span{background:var(--bg2);border:1px solid var(--line);border-radius:7px;font-size:11px;font-weight:600;padding:4px 10px;color:var(--tx2);}
.dpc-cta{font-size:13px;font-weight:700;color:var(--g);margin-top:auto;padding-top:4px;}

/* ANON MSG UI */
.anon-msg-ui{display:flex;flex-direction:column;gap:7px;}
.anon-target{display:flex;align-items:center;gap:7px;background:var(--c2);border-radius:8px;padding:7px 9px;}
.anon-ico{font-size:18px;}
.anon-type-row{display:flex;gap:4px;flex-wrap:wrap;}
.anon-type{padding:4px 8px;border-radius:6px;border:1px solid var(--line);background:var(--card);font-family:'Outfit',sans-serif;font-size:9px;font-weight:700;cursor:pointer;color:var(--tx3);transition:all .2s;}
.anon-type.on{background:var(--bl);color:#fff;border-color:var(--bl);}
.anon-ta{width:100%;height:58px;border-radius:7px;border:1px solid var(--line);background:var(--card);color:var(--tx);font-family:'Outfit',sans-serif;font-size:11px;padding:7px 9px;resize:none;outline:none;transition:border-color .2s;}
.anon-ta:focus{border-color:var(--bl);}
.anon-note{font-size:9px;color:var(--tx3);text-align:center;padding:2px 0;}

/* INFO CARDS (Botinec Living) */
.info-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;}
.info-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;text-align:center;transition:all .3s;}
.info-card:hover{border-color:var(--gbdr);transform:translateY(-3px);box-shadow:var(--sh2);}
.ic-icon{font-size:26px;margin-bottom:8px;}
.ic-label{font-size:9.5px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--tx3);margin-bottom:4px;}
.ic-val{font-size:18px;font-weight:800;letter-spacing:-.3px;margin-bottom:2px;}
.ic-sub{font-size:11px;color:var(--tx3);line-height:1.4;}

/* TECH GRID */
.tech-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;}
.tech-item{display:flex;align-items:flex-start;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;}
.tc-ico{font-size:22px;flex-shrink:0;margin-top:2px;}
.tech-item strong{font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;display:block;margin-bottom:4px;}
.tech-item p{font-family:'Outfit',sans-serif;font-size:12.5px;color:var(--tx3);line-height:1.6;margin:0;}

/* TIME LOCKER PRODUCTS */
.tl-products{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;}
.tlp{background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:24px;transition:all .3s;position:relative;display:flex;flex-direction:column;gap:10px;}
.tlp:hover{border-color:var(--gbdr);transform:translateY(-4px);box-shadow:var(--sh2);}
.tlp-featured{border-color:var(--g);box-shadow:0 0 28px rgba(42,125,79,.12);}
.tlp-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--g);color:#fff;font-size:10px;font-weight:700;padding:3px 12px;border-radius:20px;white-space:nowrap;}
.tlp-icon{font-size:32px;}
.tlp h3{font-family:'Outfit',sans-serif;font-size:17px;font-weight:700;margin:0;}
.tlp p{font-family:'Outfit',sans-serif;font-size:13px;color:var(--tx3);line-height:1.6;margin:0;}
.tlp-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px;}
.tlp-list li{font-family:'Outfit',sans-serif;font-size:12.5px;color:var(--tx2);}
.tlp-price{font-size:22px;font-weight:800;color:var(--g);margin-top:auto;}
.tl-earn{background:var(--c2);border:1.5px solid var(--gbdr);border-radius:var(--r);padding:20px 24px;}
.tl-earn-inner{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.tl-earn-inner strong{font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;display:block;margin-bottom:4px;}
.tl-earn-inner p{font-family:'Outfit',sans-serif;font-size:13px;color:var(--tx3);line-height:1.6;margin:0;}

/* MOBILE */
@media(max-width:500px){
  .hstats{width:100%;}
  .hst{flex:1;min-width:80px;}
}