/* OBITELJSKI DOM PTIČEK – boje iz loga: crveni krov (#c7262b), siva kuća, zelena trava, plavi prozor; topla svijetla podloga */
:root{
  --accent:#c7262b; --accent2:#e0473d; --accent-d:#9e1c20; --green:#6cb448; --green-d:#4f8f31; --sky:#78b4e4; --grey:#8e9a9a;
  --bg:#fff; --bg-alt:#faf6f1; --ink:#2d2a28; --muted:#5f5a55; --line:#ece4da; --dark:#3a3431;
  --shadow:0 24px 50px -24px rgba(80,50,30,.3);
  --head:"Lora",Georgia,serif; --sans:"Nunito Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
body{font-size:17.5px}
h1,h2,h3,h4{font-family:var(--head);font-weight:600;letter-spacing:-.01em}
h3{font-size:22px}
em{font-style:italic;color:var(--accent)}
.eyebrow{color:var(--green-d)}
.eyebrow svg{width:17px;height:17px}
.lead{font-size:19px;color:var(--muted)}
.btn{border-radius:999px;font-size:16px}
.btn svg{width:18px;height:18px}
.btn-accent{background:linear-gradient(135deg,var(--accent2),var(--accent));box-shadow:0 10px 24px -10px rgba(199,38,43,.6)}
.btn-line{border-color:var(--accent);color:var(--accent)}
.btn-line:hover{background:var(--accent);color:#fff}
.fico{background:linear-gradient(135deg,var(--accent2),var(--accent));color:#fff;display:grid;place-items:center}
.progress,.loader-bar i,.sec-head h2::after{background:linear-gradient(90deg,var(--accent),var(--green))}
.menu>li>a.on{color:var(--accent)}
.menu>li>a:not(.btn){font-weight:700;font-size:16px}
.nav{border-radius:999px;padding-left:16px}
.wrap{position:relative}
svg[fill=none]{fill:none!important}
.brand{display:flex;align-items:center;gap:10px}
.brand img{height:44px;width:auto}
.brand span{display:grid;line-height:1.05}
.brand b{font:700 22px var(--head);color:var(--accent)}
.brand small{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--green-d);font-weight:700}
.center{text-align:center;margin-top:34px}

/* topbar */
.topbar{background:var(--dark);color:#e6ddd4;font-size:14px;position:relative;z-index:61}
.topbar .wrap{display:flex;gap:24px;justify-content:flex-end;padding:7px 0}
.topbar span,.topbar a{display:inline-flex;gap:7px;align-items:center}
.topbar a:hover{color:#fff}
.topbar svg{width:14px;height:14px;color:#f3a29b}
.hdr{top:34px}.hdr.scrolled{top:0}

/* ptičica */
.bird{width:64px;height:40px;overflow:visible}
.bird .body{fill:var(--accent)}
.bird .wing{fill:var(--accent-d);transform-origin:28px 20px}
.bird .w1{animation:flapA .38s ease-in-out infinite alternate}
.bird .w2{fill:#e2574f;animation:flapB .38s ease-in-out infinite alternate}
@keyframes flapA{from{transform:rotate(18deg) scaleY(.6)}to{transform:rotate(-12deg)}}
@keyframes flapB{from{transform:rotate(-22deg) scaleY(.5)}to{transform:rotate(8deg)}}

/* loader: kućica se iscrta, ptičica sleti na krov */
.ld-house{position:relative;width:220px;height:120px}
.house{width:220px;height:110px;fill:none;stroke-linecap:round;stroke-linejoin:round}
.house path{stroke-dasharray:400;stroke-dashoffset:400;animation:draw 1.2s var(--ease) forwards}
.house .h-roof-g{stroke:var(--grey);stroke-width:9}
.house .h-roof-r{stroke:var(--accent);stroke-width:9;animation-delay:.25s}
.house .h-wall{stroke:#b9c2c2;stroke-width:4;animation-delay:.45s}
.house .h-grass{stroke:var(--green);stroke-width:5;animation-delay:.7s}
.house .h-win{fill:var(--sky);opacity:0;animation:pop .4s var(--ease) 1s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes pop{to{opacity:1}}
.ld-house .bird{position:absolute;width:40px;height:26px;left:-60px;top:-30px;animation:land 1.4s var(--ease) .6s forwards}
@keyframes land{0%{transform:translate(0,0)}100%{transform:translate(222px,26px)}}
.loader-word{font:600 40px/1.1 var(--head);color:var(--ink);opacity:0;transform:translateY(10px);animation:ldIn .7s var(--ease) .6s forwards;text-align:center}
.loader-word b{color:var(--accent);font-style:italic}
.loader-sub{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);opacity:0;animation:ldIn .7s var(--ease) .8s forwards;margin-top:-10px}
@keyframes ldIn{to{opacity:1;transform:none}}
.loader-in{background:linear-gradient(180deg,#fff,var(--bg-alt))}
.loader-logo{display:none}
.loader-panel.p1{background:var(--bg-alt)}.loader-panel.p2{background:var(--accent)}
.curtain{background:linear-gradient(180deg,#fdf1e8,var(--bg-alt) 55%,var(--green) 55.2%,var(--green-d));display:grid;place-items:center}
.curtain::after{display:none}
.curtain .bird{width:110px;height:70px;animation:hover 1s ease-in-out infinite}
@keyframes hover{50%{transform:translateY(-10px)}}

/* jato ptica */
.flock{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.flock .bird{position:absolute;left:-80px;width:34px;height:22px;animation:fly 22s linear infinite}
.flock .bird:nth-child(1){top:22%}
.flock .bird:nth-child(2){top:30%;width:24px;animation-delay:-9s;animation-duration:26s}
.flock .bird:nth-child(3){top:16%;width:28px;animation-delay:-15s;animation-duration:30s}
.flock.big .bird .body{fill:#fff}.flock.big .bird .wing{fill:#f1e7de}
@keyframes fly{0%{transform:translate(0,0)}25%{transform:translate(28vw,-30px)}50%{transform:translate(55vw,10px)}75%{transform:translate(82vw,-20px)}100%{transform:translate(calc(100vw + 160px),0)}}
.js:not(.seen):not(.ready) .flock .bird{animation-play-state:paused}

/* brežuljak */
.hill{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:clamp(40px,6vw,80px);z-index:3}
.hill path{fill:#fff}

/* hero */
.hero-p{min-height:92vh;padding:170px 0 150px;background:var(--dark);color:#fff}
.hero-p::after{display:none}
.hero-p .slides,.hero-p .slide{position:absolute;inset:0}
.hero-p .slide{opacity:0;transition:opacity 1.6s ease}
.hero-p .slide.active{opacity:1}
.hero-p .slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);transition:transform 10s linear}
.hero-p .slide.active img{transform:scale(1)}
.hero-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(45,30,25,.78),rgba(45,30,25,.4) 60%,rgba(45,30,25,.15))}
.hero-p .hero-in{z-index:4;grid-template-columns:1fr;max-width:780px;margin-left:max(20px,calc((100% - 1240px)/2))}
.hero-p h1{font-size:clamp(40px,5.4vw,72px);line-height:1.08;color:#fff}
.hero-p h1 em .w>span{color:#ffd3cc;background:none;-webkit-text-fill-color:currentColor}
.hero-p p{color:#f1e9e2;font-size:20px}
.pill{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);color:#fff;backdrop-filter:blur(6px)}
.pill i{background:var(--green)}
.btn-ghost{border:1.5px solid rgba(255,255,255,.65);color:#fff}
.hero-p .dots{display:flex;gap:7px;margin-top:36px}
.dot{width:10px;height:10px;border-radius:10px;border:0;padding:0;cursor:pointer;background:rgba(255,255,255,.55);transition:width .4s var(--ease)}
.dot.active{width:30px;background:#fff}

/* page hero */
.phero{background:var(--dark);color:#fff;padding:190px 0 130px}
.phero-bg img{opacity:.5;filter:none}
.phero::after{background:linear-gradient(90deg,rgba(45,30,25,.82),rgba(45,30,25,.35));display:block}
.phero h1{color:#fff}.phero p{color:#f1e9e2}
.phero-in{z-index:4}
.crumbs,.crumbs a{color:#e6ddd4}.crumbs a:hover{color:#fff}
.phero .eyebrow{color:#bfe3a8}
.phero .flock .bird .body{fill:#fff}.phero .flock .bird .wing{fill:#f1e7de}

/* stats */
.stats-sec{padding:0;margin-top:-30px;position:relative;z-index:5}
.stats{border-radius:24px}
.stat b{font-family:var(--head);color:var(--accent)}
.stat span{font-size:15px}

/* dvostupčano */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.polaroids{position:relative;height:460px}
.pol{position:absolute;width:62%;border:10px solid #fff;border-bottom-width:34px;box-shadow:var(--shadow);border-radius:4px;background:#fff;object-fit:cover;aspect-ratio:4/3;transition:transform .6s var(--ease)}
.pol.p1{left:0;top:0;transform:rotate(-5deg)}
.pol.p2{right:0;top:60px;transform:rotate(4deg);z-index:2}
.pol.p3{left:18%;bottom:0;transform:rotate(-1deg);z-index:3}
.polaroids:hover .p1{transform:rotate(-8deg) translate(-10px,-6px)}
.polaroids:hover .p2{transform:rotate(7deg) translate(10px,-6px)}
.perch{position:absolute;right:14%;top:40px;z-index:4;animation:hop 4s ease-in-out infinite}
.perch .bird{width:54px;height:34px}
.perch .bird .wing{animation:none}
@keyframes hop{0%,70%,100%{transform:translateY(0)}75%{transform:translateY(-14px)}80%{transform:translateY(0)}85%{transform:translateY(-8px)}90%{transform:translateY(0)}}

/* kartice s ikonama */
.icards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ic{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;font-weight:700;transition:transform .4s var(--ease),box-shadow .4s,border-color .3s}
.ic:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:transparent}
.ic-i{width:52px;height:52px;flex:none;border-radius:16px;background:#fdecea;color:var(--accent);display:grid;place-items:center;transition:background .3s,color .3s}
.ic:nth-child(3n+2) .ic-i{background:#edf6e6;color:var(--green-d)}
.ic:nth-child(3n) .ic-i{background:#e9f3fb;color:#3d86c1}
.ic:hover .ic-i{background:var(--accent);color:#fff}
.ic-i svg{width:26px;height:26px}
.icards.big{grid-template-columns:repeat(2,1fr);gap:18px}
.icards.big .ic{padding:22px 24px;font-size:18px}

/* jedinice */
.units{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.unit{background:#fff;border-radius:24px;overflow:hidden;box-shadow:var(--shadow);display:block}
.unit-img{aspect-ratio:4/3;overflow:hidden;background:var(--bg-alt)}
.unit-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.unit:hover .unit-img img{transform:scale(1.07)}
.unit-b{padding:0 24px 24px;position:relative}
.u-ico{width:58px;height:58px;border-radius:18px;background:var(--accent);color:#fff;display:grid;place-items:center;margin-top:-29px;position:relative;box-shadow:0 12px 24px -10px rgba(199,38,43,.6);border:4px solid #fff}
.u-ico svg{width:26px;height:26px}
.unit h3{margin:14px 0 4px}
.unit p{color:var(--muted);margin:0}

/* parallax */
.parallax{position:relative;background-size:cover;background-position:center;background-attachment:fixed;padding:clamp(90px,12vw,170px) 0;color:#fff;text-align:center}
.parallax::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(45,30,25,.55),rgba(45,30,25,.7))}
.par-in{position:relative;max-width:760px}
.parallax h2{font-size:clamp(30px,3.6vw,46px)}
.parallax p{color:#f1e9e2;font-size:19px}
.parallax .eyebrow{color:#bfe3a8;justify-content:center;display:flex}
@supports (-webkit-touch-callout:none){.parallax{background-attachment:scroll}}

/* sigurnost */
.safe{display:grid;gap:14px;margin-top:22px}
.sf{display:flex;gap:16px;align-items:center;background:var(--bg-alt);border-radius:18px;padding:18px}
.sf b{font:600 19px var(--head)}
.sf p{margin:2px 0 0;color:var(--muted)}
.sf-i{width:56px;height:56px;flex:none;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center}
.sf-i svg{width:26px;height:26px}
.pulse-ring{box-shadow:0 0 0 0 rgba(199,38,43,.5);animation:pulse-r 2s infinite}
@keyframes pulse-r{70%{box-shadow:0 0 0 18px rgba(199,38,43,0)}100%{box-shadow:0 0 0 0 rgba(199,38,43,0)}}
.photo-frame{border-radius:24px;overflow:hidden;box-shadow:var(--shadow);background:var(--bg-alt);border:8px solid #fff}
.photo-frame img{width:100%;display:block}

/* galerija */
.gallery{columns:4 220px;column-gap:14px}
.home-gal{columns:3 240px}
.g-item{display:block;margin-bottom:14px;border-radius:18px;overflow:hidden;position:relative;break-inside:avoid;opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease);background:var(--bg-alt)}
.g-item.in,.reveal.in .g-item{opacity:1;transform:none}
.g-item img{width:100%;display:block;transition:transform 1s var(--ease)}
.g-item:hover img{transform:scale(1.06)}
.g-cap{position:absolute;left:12px;bottom:12px;background:rgba(255,255,255,.92);color:var(--ink);font-weight:700;font-size:14px;padding:6px 12px;border-radius:99px;transform:translateY(8px);opacity:0;transition:all .4s var(--ease)}
.g-item:hover .g-cap{transform:none;opacity:1}
.lb{position:fixed;inset:0;z-index:100;background:rgba(35,25,20,.95);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.lb.open{opacity:1;visibility:visible}
.lb figure{margin:0;text-align:center}
.lb img{max-width:92vw;max-height:84vh;border-radius:10px;transform:scale(.94);opacity:0;transition:transform .45s var(--ease),opacity .45s}
.lb.open img.ready{transform:none;opacity:1}
.lb figcaption{color:#e6ddd4;font-size:14px;margin-top:10px}
.lb button{position:absolute;background:rgba(255,255,255,.14);border:0;color:#fff;cursor:pointer;border-radius:50%;width:56px;height:56px;font-size:32px;line-height:1}
.lb button:hover{background:var(--accent)}
.lb-x{top:20px;right:20px}.lb-p{left:20px}.lb-n{right:20px}

/* kontakt */
.c-card{color:inherit}
.c-card .fico svg{width:22px;height:22px}
.c-card b{font-size:19px}
.c-form{border-radius:24px}
.c-form h2{font-size:30px}
.c-form input:focus,.c-form textarea:focus,.c-form select:focus{box-shadow:0 0 0 4px rgba(199,38,43,.14)}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.map{border-radius:24px;overflow:hidden;min-height:380px;background:var(--bg-alt);position:relative;box-shadow:var(--shadow)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.map-ph{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:14px;text-align:center;padding:20px;background:repeating-linear-gradient(45deg,#f4eee7 0 16px,#faf6f1 16px 32px)}
.map-ph b{font:600 22px var(--head)}
.map-ph .more{color:var(--accent);font-weight:700;display:inline-flex;gap:6px;align-items:center}
.map-ph .more svg{width:16px;height:16px}
.pin-pulse{width:64px;height:64px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;box-shadow:0 0 0 0 rgba(199,38,43,.5);animation:pulse-r 2s infinite}
.pin-pulse svg{width:30px;height:30px}
.narrow{max-width:820px}
.prose ul{padding-left:20px}

/* CTA, footer */
.cta-in{background:linear-gradient(135deg,var(--accent2),var(--accent) 55%,var(--accent-d))}
.cta-in::before{background:var(--green);opacity:.45}
.cta .eyebrow{color:#fff}
.cta .btn-accent{background:#fff;color:var(--accent-d)}
.ftr{background:var(--dark);color:#cfc5bb}
.ftr-logo{background:#fff;padding:10px 14px;border-radius:14px}
.ftr-logo img{height:48px}
.ftr .fc svg{width:16px;height:16px;flex:none;color:#f3a29b}
.ftr h4{color:#fff}
.totop{background:var(--accent);border-radius:50%}
.cookie a{color:var(--accent);text-decoration:underline}
.cookie .btn{flex:none;padding:10px 20px}
.nf h1{background:linear-gradient(90deg,var(--accent),var(--green));-webkit-background-clip:text;background-clip:text;color:transparent}
.nf-bird{width:120px;margin:auto;animation:hover 1.2s ease-in-out infinite}
.nf-bird .bird{width:120px;height:75px}

@media (max-width:1100px){.icards{grid-template-columns:repeat(3,1fr)}}
@media (max-width:1024px){
  .two-col{grid-template-columns:1fr}.units{grid-template-columns:1fr 1fr}
  .icards{grid-template-columns:1fr 1fr}
  .topbar .wrap{justify-content:center}.topbar span{display:none}
}
@media (max-width:640px){
  .units,.icards,.icards.big,.f2{grid-template-columns:1fr}
  .gallery,.home-gal{columns:2 140px;column-gap:8px}
  .polaroids{height:340px}
  .topbar{display:none}.hdr{top:0}
  .brand small{display:none}
}
@media (prefers-reduced-motion:reduce){.flock,.perch{display:none}.parallax{background-attachment:scroll}}