@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');
:root{--brick:#f7c600;--brick2:#f7b500;--dark:#07111f;--ink:#101827;--muted:#637083;--cream:#f3f8ff;--line:#dbe7f4;--surface:#fff;--shadow:0 24px 70px rgba(6,31,58,.12)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff;overflow-x:hidden}a{text-decoration:none;color:inherit}.container{width:min(1180px,calc(100% - 40px));margin:auto}.site-header{position:fixed;inset:0 0 auto 0;background:rgba(7,17,31,.74);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.12);z-index:100}.header-inner{height:82px;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand{display:flex;align-items:center;gap:13px;color:#fff;font-weight:950}.brand-mark{width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,var(--brick),var(--brick2));display:grid;place-items:center;color:#fff;letter-spacing:-.08em;box-shadow:0 14px 34px rgba(0,0,0,.18)}.brand small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:rgba(255,255,255,.72);margin-top:2px}.nav{display:flex;gap:22px;align-items:center;color:#fff;font-weight:850}.nav a{position:relative;padding:10px 0}.nav a:after{content:"";position:absolute;left:0;right:0;bottom:3px;height:2px;background:linear-gradient(90deg,#fff,var(--brick2));transform:scaleX(0);transform-origin:left;transition:.25s}.nav a:hover:after,.nav a.active:after{transform:scaleX(1)}.call-btn,.btn{border:0;border-radius:999px;padding:15px 22px;font-weight:950;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}.call-btn{background:#fff;color:var(--dark)}.btn.primary{background:linear-gradient(135deg,var(--brick),var(--brick2));color:#fff;box-shadow:0 18px 42px rgba(247,198,0,.25)}.btn.ghost{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.72);backdrop-filter:blur(10px)}.btn.ghost.dark{color:var(--brick);border-color:var(--line);background:#fff}.btn.light{background:#fff;color:var(--brick)}.mobile-toggle{display:none}.hero{min-height:100vh;display:flex;align-items:center;position:relative;padding:150px 0 72px;background:linear-gradient(90deg,rgba(7,17,31,.82),rgba(7,17,31,.45),rgba(7,17,31,.72)),url('assets/img/borjan-04.jpg') center/cover no-repeat;overflow:hidden}.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 48% 40%,rgba(255,209,165,.18),transparent 34%),linear-gradient(to bottom,rgba(0,0,0,.08),rgba(0,0,0,.42));pointer-events:none}.hero-content{position:relative;z-index:2;color:#fff;max-width:930px;text-align:center}.eyebrow{display:inline-flex;border-radius:999px;padding:10px 16px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.25);color:#fff;font-weight:950;text-transform:uppercase;letter-spacing:.13em;font-size:12px}.eyebrow.dark{background:#fff1e7;color:var(--brick);border-color:#f1d7c9}h1{font-size:clamp(42px,6vw,82px);line-height:.96;letter-spacing:-.065em;margin:24px 0 22px}h2{font-size:clamp(32px,4vw,56px);line-height:1;letter-spacing:-.05em;margin:0 0 18px}h3{font-size:23px;margin:12px 0}p{font-size:18px;line-height:1.68;color:var(--muted)}.hero p{max-width:760px;margin:0 auto;color:rgba(255,255,255,.92);font-size:clamp(18px,2vw,24px);line-height:1.45}.hero-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:36px}section{padding:88px 0}.section-head{max-width:720px}.section-head.center{text-align:center;margin:0 auto 40px}.section-head span,.rich-card span{color:var(--brick);font-weight:950;text-transform:uppercase;letter-spacing:.13em;font-size:13px}.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.services-grid.four{grid-template-columns:repeat(4,1fr)}.service-card,.quote-card,.contact-card,.faq-item,.timeline-item{background:#fff;border:1px solid var(--line);border-radius:30px;padding:28px;box-shadow:var(--shadow);transition:.25s}.service-card:hover,.gallery-grid a:hover{transform:translateY(-5px)}.service-card b,.timeline-item b{width:48px;height:48px;border-radius:16px;background:linear-gradient(135deg,var(--brick),var(--brick2));color:#fff;display:grid;place-items:center;font-weight:950}.soft{background:linear-gradient(135deg,var(--cream),#fff)}.split,.page-hero-grid,.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}.page-hero{padding:150px 0 88px;background:linear-gradient(135deg,#fff7ef,#fff)}.page-hero-grid img,.image-card img{width:100%;height:520px;object-fit:cover;border-radius:34px;box-shadow:var(--shadow);border:1px solid var(--line)}.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:26px}.check-grid div,.contact-note{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;font-weight:900;color:var(--brick);box-shadow:0 12px 34px rgba(6,31,58,.08)}.nice-list{color:var(--muted);font-size:17px;line-height:1.9}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.gallery-grid a{display:block;border-radius:28px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);transition:.25s}.gallery-grid img{width:100%;height:340px;object-fit:cover;display:block;transition:.35s}.gallery-grid a:hover img{transform:scale(1.05)}.rich{padding:70px 0}.rich-card{background:radial-gradient(circle at 85% 20%,rgba(247,198,0,.35),transparent 32%),linear-gradient(135deg,#07111f,#2a2412);border-radius:38px;padding:46px;display:flex;justify-content:space-between;align-items:center;color:#fff;gap:25px}.rich-card p{color:#f4ded0}.footer{background:#07111f;color:#fff;padding:62px 0 26px}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:44px}.footer p,.copyright{color:#d7c6bd;font-size:15px}.footer a{display:block;color:#fff;margin:10px 0}.copyright{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;margin-top:38px}.copyright a{display:inline;font-weight:900}.floating-call{position:fixed;right:22px;bottom:22px;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--brick),var(--brick2));color:#fff;font-size:26px;box-shadow:0 18px 42px rgba(247,181,0,.35);z-index:50}.page-title{padding:150px 0 70px;background:linear-gradient(135deg,#fff7ef,#fff);text-align:center}.page-title .eyebrow{background:#fff1e7;color:var(--brick);border-color:#f1d7c9}.contact-grid{align-items:stretch}.contact-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.map-card{min-height:430px;border-radius:34px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line)}.map-card iframe{width:100%;height:100%;border:0;display:block}.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.faq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.loaded .reveal.in-view{opacity:1;transform:none}@media(max-width:1100px){.services-grid.four{grid-template-columns:repeat(2,1fr)}.timeline{grid-template-columns:repeat(2,1fr)}}@media(max-width:960px){.container{width:min(100% - 28px,1180px)}.header-inner{height:auto;min-height:72px;padding:10px 0;display:grid;grid-template-columns:1fr auto}.brand span:not(.brand-mark){font-size:15px}.brand-mark{width:46px;height:46px}.call-btn{display:none}.mobile-toggle{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:16px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.2);cursor:pointer}.mobile-toggle span,.mobile-toggle span:before,.mobile-toggle span:after{width:22px;height:2px;background:#fff;border-radius:999px;display:block;position:relative}.mobile-toggle span:before,.mobile-toggle span:after{content:"";position:absolute;left:0}.mobile-toggle span:before{top:-7px}.mobile-toggle span:after{top:7px}.nav{display:none}body.menu-open .nav{display:flex;position:absolute;top:76px;left:12px;right:12px;flex-direction:column;gap:0;background:#07111f;border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:12px;box-shadow:0 28px 80px rgba(0,0,0,.22)}body.menu-open .nav a{padding:14px 16px;width:100%;border-radius:16px}body.menu-open .nav a.active,body.menu-open .nav a:hover{background:rgba(255,255,255,.08)}.hero{min-height:100svh;padding:130px 0 58px;background-position:center}.hero-content{text-align:center}.page-hero{padding:125px 0 60px}.split,.page-hero-grid,.contact-grid,.rich-card{grid-template-columns:1fr;gap:30px}.services-grid,.services-grid.four,.faq-grid,.gallery-grid,.timeline{grid-template-columns:1fr 1fr}section{padding:58px 0}.page-hero-grid img,.image-card img{height:auto}.rich-card{align-items:flex-start}.map-card{min-height:320px}}@media(max-width:560px){h1{font-size:42px}.hero p{font-size:17px}.hero-actions .btn,.contact-actions .btn{width:100%}.services-grid,.services-grid.four,.faq-grid,.gallery-grid,.timeline,.check-grid{grid-template-columns:1fr}.gallery-grid img{height:auto}.service-card,.quote-card,.contact-card,.faq-item,.timeline-item{padding:24px}.floating-call{right:16px;bottom:16px;width:56px;height:56px}.brand small{font-size:9px}.brand-mark{width:42px;height:42px;font-size:14px}}

.brand-mark{letter-spacing:-.04em;color:#07111f}.btn.primary{color:#07111f}.service-card b,.timeline-item b{color:#07111f}.hero .btn.primary{color:#07111f}.gallery-grid img{background:#eef4fb}.footer strong{font-size:24px}


/* MOBILE FIX - sprečava pucanje sajta i horizontalni scroll */
html,body{width:100%;max-width:100%;overflow-x:hidden}
main,section,.site-header,.hero,.page-hero,.page-title,.footer{width:100%;max-width:100vw;overflow:hidden}
img,iframe{max-width:100%}
.brand,.brand span,.nav a,.btn,h1,h2,h3,p{min-width:0}

@media(max-width:960px){
  .container{width:100%;max-width:100%;padding-left:16px;padding-right:16px;margin:0 auto}
  .site-header{left:0;right:0;width:100vw}
  .header-inner{width:100%;grid-template-columns:minmax(0,1fr) auto;overflow:hidden}
  .brand{max-width:calc(100vw - 92px);overflow:hidden}
  .brand span:not(.brand-mark){display:block;max-width:100%;white-space:normal;line-height:1.08;overflow-wrap:anywhere}
  .hero{width:100vw;min-height:100svh;padding:124px 0 52px;background-position:center center}
  .hero-content{width:100%;max-width:100%;padding:0;margin:0 auto;text-align:center}
  .hero h1,.page-hero h1,.page-title h1{max-width:100%;overflow-wrap:break-word;word-break:normal;hyphens:auto;letter-spacing:-.04em}
  .hero p{max-width:100%;overflow-wrap:break-word}
  .hero-actions{width:100%;max-width:100%;justify-content:center}
  .hero-actions .btn,.contact-actions .btn{max-width:100%;white-space:normal;text-align:center}
  body.menu-open .nav{left:16px;right:16px;width:auto;max-width:calc(100vw - 32px)}
}

@media(max-width:560px){
  .container{padding-left:14px;padding-right:14px}
  h1{font-size:clamp(32px,10.5vw,40px);line-height:1.02;letter-spacing:-.035em}
  .hero p{font-size:16px;line-height:1.5}
  .eyebrow{max-width:100%;white-space:normal;text-align:center;justify-content:center;font-size:10px;letter-spacing:.08em;padding:9px 12px}
  .hero-actions{gap:12px}
  .hero-actions .btn{width:100%;max-width:320px;margin-left:auto;margin-right:auto}
  .brand-mark{flex:0 0 42px}
}

/* FULL MOBILE OPTIMIZATION - final fix */
@media(max-width:960px){
  html,body{width:100%;max-width:100%;overflow-x:hidden;background:#fff}
  *,*::before,*::after{max-width:100%}
  .site-header{overflow:visible!important;width:100%!important;max-width:100%!important;left:0!important;right:0!important;background:rgba(7,17,31,.94)!important}
  main,section,.hero,.page-hero,.page-title,.footer{width:100%!important;max-width:100%!important;overflow:hidden}
  .container{width:100%!important;max-width:100%!important;margin:0 auto!important;padding-left:16px!important;padding-right:16px!important}
  .header-inner{width:100%!important;max-width:100%!important;min-height:74px!important;height:auto!important;display:grid!important;grid-template-columns:minmax(0,1fr) 48px!important;align-items:center!important;gap:10px!important;overflow:visible!important;padding:10px 0!important}
  .brand{min-width:0!important;max-width:100%!important;overflow:hidden!important;gap:10px!important}
  .brand-mark{flex:0 0 44px!important;width:44px!important;height:44px!important;border-radius:15px!important;font-size:14px!important}
  .brand span:not(.brand-mark){min-width:0!important;max-width:100%!important;display:block!important;white-space:normal!important;overflow-wrap:anywhere!important;line-height:1.08!important;font-size:15px!important}
  .brand small{font-size:9px!important;line-height:1.2!important;letter-spacing:.06em!important}
  .mobile-toggle{display:flex!important;position:relative!important;z-index:1002!important;width:48px!important;height:48px!important;flex:0 0 48px!important}
  .nav{display:none!important}
  body.menu-open .nav{display:flex!important;position:absolute!important;top:calc(100% + 8px)!important;left:16px!important;right:16px!important;width:auto!important;max-width:calc(100vw - 32px)!important;flex-direction:column!important;gap:4px!important;background:#07111f!important;border:1px solid rgba(255,255,255,.16)!important;border-radius:22px!important;padding:10px!important;box-shadow:0 30px 80px rgba(0,0,0,.35)!important;z-index:1001!important;overflow:visible!important}
  body.menu-open .nav a{display:block!important;width:100%!important;padding:15px 16px!important;border-radius:14px!important;color:#fff!important;font-size:15px!important;line-height:1.2!important}
  body.menu-open .nav a.active,body.menu-open .nav a:hover{background:rgba(247,198,0,.16)!important;color:#f7c600!important}
  body.menu-open .nav a:after{display:none!important}
  body.menu-open .mobile-toggle span{background:transparent!important}
  body.menu-open .mobile-toggle span:before{top:0!important;transform:rotate(45deg)!important}
  body.menu-open .mobile-toggle span:after{top:0!important;transform:rotate(-45deg)!important}

  .hero{min-height:100svh!important;padding:124px 0 54px!important;background-position:center center!important;display:flex!important;align-items:center!important}
  .hero-content{width:100%!important;max-width:100%!important;margin:0 auto!important;text-align:center!important}
  .hero h1,.page-hero h1,.page-title h1{width:100%!important;max-width:100%!important;overflow-wrap:break-word!important;word-break:normal!important;hyphens:auto!important;letter-spacing:-.035em!important}
  .hero p,.page-hero p,.page-title p,.section-head p,p{max-width:100%!important;overflow-wrap:break-word!important}
  .hero-actions,.contact-actions{width:100%!important;max-width:100%!important;display:flex!important;justify-content:center!important;gap:12px!important}
  .btn,.call-btn{max-width:100%!important;white-space:normal!important;text-align:center!important;line-height:1.2!important}
  .page-hero-grid,.split,.contact-grid,.rich-card{grid-template-columns:1fr!important;gap:28px!important}
  .services-grid,.services-grid.four,.gallery-grid,.timeline,.faq-grid,.check-grid{grid-template-columns:1fr 1fr!important;gap:16px!important}
  .page-hero-grid img,.image-card img,.gallery-grid img{height:auto!important;max-height:none!important}
  .map-card{min-height:330px!important}

  .footer{padding:48px 0 24px!important;overflow:hidden!important}
  .footer-grid{display:grid!important;grid-template-columns:1fr!important;gap:24px!important;width:100%!important;max-width:100%!important}
  .footer strong{display:block!important;font-size:22px!important;line-height:1.15!important;overflow-wrap:anywhere!important}
  .footer p,.footer a,.copyright{max-width:100%!important;overflow-wrap:anywhere!important;word-break:normal!important}
  .copyright{margin-top:24px!important;padding-top:18px!important;line-height:1.5!important}
  .floating-call{z-index:900!important}
}

@media(max-width:560px){
  .container{padding-left:14px!important;padding-right:14px!important}
  h1{font-size:clamp(31px,10vw,39px)!important;line-height:1.03!important;margin:18px 0 16px!important}
  h2{font-size:clamp(27px,8vw,34px)!important;line-height:1.07!important}
  h3{font-size:21px!important}
  p{font-size:16px!important;line-height:1.6!important}
  .hero p{font-size:16px!important;line-height:1.5!important}
  .eyebrow{max-width:100%!important;white-space:normal!important;text-align:center!important;justify-content:center!important;font-size:10px!important;letter-spacing:.07em!important;padding:9px 12px!important}
  .hero-actions .btn,.contact-actions .btn{width:100%!important;max-width:330px!important;margin-left:auto!important;margin-right:auto!important;padding:15px 18px!important}
  .services-grid,.services-grid.four,.gallery-grid,.timeline,.faq-grid,.check-grid{grid-template-columns:1fr!important}
  .service-card,.quote-card,.contact-card,.faq-item,.timeline-item{padding:22px!important;border-radius:24px!important}
  .rich-card{padding:26px!important;border-radius:26px!important}
  .page-hero{padding:112px 0 48px!important}
  .page-title{padding:112px 0 48px!important}
  section{padding:50px 0!important}
  .footer{padding-bottom:86px!important}
}

/* CTA MOBILE BUTTON FIX */
@media(max-width:960px){
  .rich-card{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
  }
  .rich-card .btn,
  .rich-card .btn.light{
    align-self:stretch!important;
    width:100%!important;
    max-width:100%!important;
    min-height:52px!important;
    border-radius:999px!important;
    padding:16px 20px!important;
    white-space:normal!important;
    text-align:center!important;
    line-height:1.25!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
  }
}

@media(max-width:560px){
  .rich-card{
    gap:20px!important;
  }
  .rich-card .btn,
  .rich-card .btn.light{
    font-size:16px!important;
    min-height:54px!important;
  }
}


/* LOGO FIX */
.site-logo{width:58px;height:58px;object-fit:contain;border-radius:14px;display:block;flex:0 0 58px;box-shadow:0 10px 28px rgba(0,0,0,.22)}
@media(max-width:960px){.site-logo{width:48px!important;height:48px!important;flex:0 0 48px!important;border-radius:12px!important}.brand{align-items:center!important}}
@media(max-width:560px){.site-logo{width:44px!important;height:44px!important;flex:0 0 44px!important}}
