:root{--black:#070809;--gold:#c99642;--gold2:#e2ac54;--white:#fff;--light:#f8f8f6;--text:#111;--body:#3a3a3a;--container:1280px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--text);background:var(--light)}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}.container{width:min(var(--container),calc(100% - 112px));margin-inline:auto}
.site-header{position:fixed;top:0;z-index:20;width:100%;height:86px;display:flex;align-items:center;gap:42px;padding:0 52px;color:white;background:linear-gradient(180deg,rgba(0,0,0,.72),rgba(0,0,0,.04))}.brand{display:flex;align-items:center;gap:16px;min-width:245px}.brand-mark{font-size:44px;line-height:1;color:var(--gold);font-weight:800;letter-spacing:-.08em}.brand small{display:block;font-weight:400;margin-top:5px}.site-header nav,footer nav{display:flex;gap:42px;text-transform:uppercase;font-weight:700;font-size:14px}.site-header nav a:first-child{color:var(--gold);border-bottom:2px solid var(--gold);padding-bottom:12px}.nav-cta{margin-left:auto;border:1px solid var(--gold);padding:17px 28px;color:var(--gold);text-transform:uppercase;font-weight:800;font-size:14px}
.hero{min-height:900px;position:relative;background-image:var(--hero);background-size:cover;background-position:center;display:flex;align-items:center;color:white}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.78) 38%,rgba(0,0,0,.10) 78%)}.hero-content{position:relative;z-index:2}.hero-content>*{max-width:640px}.eyebrow{color:var(--gold);text-transform:uppercase;font-weight:800;font-size:14px;letter-spacing:.02em}.eyebrow:before{content:"";display:inline-block;width:45px;height:2px;background:var(--gold);vertical-align:middle;margin-right:16px}.hero h1{font-size:64px;line-height:1.14;margin:35px 0 28px;letter-spacing:-.03em}.lead{font-size:23px;line-height:1.5;color:#eee}.actions{display:flex;gap:22px;margin-top:36px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:19px 31px;border-radius:3px;text-transform:uppercase;font-weight:800;letter-spacing:.01em;white-space:nowrap}.primary{background:var(--gold);color:white}.secondary{border:1px solid var(--gold);color:white}.outline-dark{border:1px solid var(--gold);color:var(--gold);margin:34px auto 0}
.hero-features{position:absolute;left:50%;transform:translateX(-50%);bottom:35px;z-index:3;display:grid;grid-template-columns:repeat(4,1fr);background:rgba(0,0,0,.74);border:1px solid rgba(255,255,255,.13);padding:30px 22px;gap:20px}.hero-features article{display:grid;grid-template-columns:62px 1fr;gap:12px;border-right:1px solid rgba(255,255,255,.18);padding-right:22px;min-height:92px}.hero-features article:last-child{border-right:0}.hero-features strong{text-transform:uppercase;line-height:1.35;align-self:end}.hero-features p{grid-column:2;color:#ddd;margin:4px 0 0;font-size:13px;line-height:1.55}.feature-icon{width:50px;height:50px;display:block}.feature-icon path{fill:none;stroke:var(--gold);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.section{padding:86px 0}.section h2,.contact h2{font-size:54px;line-height:1.12;margin:14px 0 22px;letter-spacing:-.03em}.section-intro{max-width:620px}.section-intro p,.process-head p,.reference-head p{font-size:18px;line-height:1.7;color:var(--body)}
.services{background:#f8f8f6}.service-grid{display:grid;grid-template-columns:1.05fr .95fr .9fr;grid-auto-rows:248px;gap:18px;margin-top:38px;grid-template-areas:"og stop stop" "balk nad poh" "kon kon poh"}.service-card{position:relative;overflow:hidden;background:#111;min-height:0}.service-card-1{grid-area:og}.service-card-2{grid-area:stop}.service-card-3{grid-area:balk}.service-card-4{grid-area:nad}.service-card-5{grid-area:poh}.service-card-6{grid-area:kon}.service-card img{width:100%;height:100%;object-fit:cover;filter:saturate(.9)}.service-card div{position:absolute;inset:auto 0 0;background:linear-gradient(0deg,rgba(0,0,0,.90),rgba(0,0,0,.04));padding:85px 30px 28px;color:white}.service-card h3{margin:0 0 9px;text-transform:uppercase;font-size:21px}.service-card p{margin:0;line-height:1.55;color:#eee;max-width:420px}.service-card span{position:absolute;right:28px;bottom:26px;color:var(--gold);font-size:34px}
.references{background:#fff}.reference-head{max-width:760px}.reference-head h2{margin-bottom:14px}.reference-head p{max-width:700px}.gallery{margin-top:38px;display:grid;grid-template-columns:1.05fr .95fr .9fr;grid-auto-rows:220px;gap:18px;grid-template-areas:"ref1 ref2 ref3" "ref1 ref4 ref5" "ref6 ref7 ref8" "ref6 ref9 ref9"}.gallery img{height:100%;width:100%;object-fit:cover;background:#ddd}.gallery img:nth-child(1){grid-area:ref1}.gallery img:nth-child(2){grid-area:ref2}.gallery img:nth-child(3){grid-area:ref3}.gallery img:nth-child(4){grid-area:ref4}.gallery img:nth-child(5){grid-area:ref5}.gallery img:nth-child(6){grid-area:ref6}.gallery img:nth-child(7){grid-area:ref7}.gallery img:nth-child(8){grid-area:ref8}.gallery img:nth-child(9){grid-area:ref9}
.process{background:#f8f8f6}.process-head{max-width:780px}.process-subtitle{font-weight:500;margin-top:-8px!important}.process-description{margin-top:22px!important;max-width:740px}.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:38px;margin-top:46px}.steps article{border-top:1px solid rgba(0,0,0,.14);padding-top:28px}.steps b{font-size:58px;line-height:1;color:#111;letter-spacing:-.04em}.steps h3{font-size:21px;margin:28px 0 14px}.steps p{line-height:1.65;color:#333;margin:0}
.contact{padding:86px 0;background:radial-gradient(circle at left,#1b1b1b,#050606 60%);color:white}.contact-inner{display:grid;grid-template-columns:1fr 1.12fr;gap:80px}.contact h2 span{color:var(--gold)}.contact-left>p{font-size:20px;color:#eee;line-height:1.6}.contact-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:58px}.contact-cards article{border-right:1px solid rgba(255,255,255,.2);padding:0 20px;text-align:center}.contact-cards article:last-child{border-right:0}.contact-cards span{display:flex;margin:0 auto 18px;width:54px;height:54px;border:1px solid var(--gold);border-radius:50%;align-items:center;justify-content:center;color:var(--gold)}.contact-cards strong{text-transform:uppercase;display:block}.contact-cards a,.contact-cards p{color:#eee;font-size:14px;overflow-wrap:anywhere}.contact-form{border:1px solid rgba(255,255,255,.18);padding:38px;background:rgba(255,255,255,.03);border-radius:8px}.contact-form h3{text-transform:uppercase;color:var(--gold);margin-top:0}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.contact-form input,.contact-form textarea{width:100%;background:transparent;border:1px solid rgba(255,255,255,.28);padding:18px;color:white;margin-bottom:16px;font:inherit}.contact-form textarea{min-height:145px}.upload{display:block;border:1px dashed var(--gold);padding:20px;margin-bottom:18px;color:#ddd}.upload input{display:none}.safe{color:#aaa;font-size:13px}
footer{background:#050606;color:white;border-top:1px solid var(--gold);padding:38px 0}.footer-inner{display:flex;align-items:center;gap:52px}footer small{margin-left:auto;color:#999}
@media(max-width:900px){.container{width:min(100% - 36px,var(--container))}.site-header nav,.nav-cta{display:none}.site-header{height:76px;padding:0 20px}.brand-mark{font-size:36px}.brand{min-width:auto}.hero{min-height:auto;display:block;padding:130px 0 40px}.hero h1{font-size:42px}.hero-content>*{max-width:100%}.actions{flex-direction:column;align-items:flex-start}.hero-features{position:relative;left:auto;right:auto;bottom:auto;transform:none;margin-top:60px;grid-template-columns:1fr}.hero-features article{border-right:0;border-bottom:1px solid rgba(255,255,255,.15);padding-bottom:20px}.section{padding:68px 0}.section h2,.contact h2{font-size:38px}.service-grid{grid-template-columns:1fr;grid-auto-rows:270px;grid-template-areas:none}.service-card{grid-area:auto!important}.gallery{grid-template-columns:1fr}.gallery{grid-template-areas:none}.gallery img,.gallery img:nth-child(1){height:260px;grid-column:auto;grid-row:auto;grid-area:auto}.steps{grid-template-columns:1fr}.contact-inner{grid-template-columns:1fr}.contact-cards{grid-template-columns:1fr 1fr}.form-row{grid-template-columns:1fr}.footer-inner{display:block}footer nav{margin:32px 0;flex-wrap:wrap}}


/* V3.0 - Mobile Hero */
.mobile-menu-button{
  display:none;
  margin-left:auto;
  width:46px;
  height:46px;
  border:1px solid rgba(255,255,255,.32);
  background:rgba(0,0,0,.22);
  color:#fff;
  font-size:24px;
  line-height:1;
  border-radius:3px;
}

@media(max-width:900px){
  .site-header{
    height:74px;
    padding:0 20px;
    background:rgba(0,0,0,.82);
    backdrop-filter:blur(10px);
  }
  .site-header nav,
  .site-header .nav-cta{
    display:none!important;
  }
  .mobile-menu-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .site-header .brand{
    min-width:0;
    gap:12px;
  }
  .site-header .brand-mark{
    font-size:34px;
  }
  .site-header .brand strong{
    font-size:13px;
    letter-spacing:.02em;
  }
  .site-header .brand small{
    font-size:11px;
    margin-top:3px;
  }

  .hero{
    min-height:auto;
    display:block;
    padding:118px 0 34px;
    background-position:center top;
  }
  .hero-overlay{
    background:
      linear-gradient(180deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,.72) 44%,rgba(0,0,0,.88) 100%),
      linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.28));
  }
  .hero-content{
    position:relative;
    z-index:2;
  }
  .hero-content > *{
    max-width:100%;
  }
  .hero .eyebrow{
    font-size:12px;
    letter-spacing:.04em;
    margin-bottom:28px;
  }
  .hero .eyebrow:before{
    width:34px;
    margin-right:12px;
  }
  .hero h1{
    font-size:39px;
    line-height:1.14;
    letter-spacing:-.04em;
    margin:0 0 22px;
  }
  .hero .lead{
    font-size:18px;
    line-height:1.55;
    max-width:92%;
    color:rgba(255,255,255,.88);
  }
  .hero .actions{
    flex-direction:column;
    align-items:stretch;
    gap:12px;
    margin-top:32px;
    max-width:100%;
  }
  .hero .btn{
    width:100%;
    min-height:56px;
    padding:18px 22px;
    font-size:14px;
  }

  .hero-features{
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    transform:none;
    width:min(100% - 36px,var(--container));
    margin:42px auto 0;
    grid-template-columns:1fr;
    gap:0;
    padding:6px 0;
    background:transparent;
    border-top:1px solid rgba(255,255,255,.18);
    border-bottom:1px solid rgba(255,255,255,.18);
    border-left:0;
    border-right:0;
  }
  .hero-features article{
    display:grid;
    grid-template-columns:38px 1fr;
    min-height:auto;
    gap:12px;
    padding:17px 0;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.13);
  }
  .hero-features article:last-child{
    border-bottom:0;
  }
  .hero-features .line-icon{
    width:32px;
    height:32px;
    transform:scale(.72);
    transform-origin:left top;
  }
  .hero-features strong{
    font-size:14px;
    line-height:1.35;
  }
  .hero-features p{
    grid-column:2;
    font-size:13px;
    margin-top:2px;
    line-height:1.45;
    color:rgba(255,255,255,.72);
  }
}


/* V3.1 - Mobile refinements from review PDF */
@media(max-width:900px){
  /* Hero feature icon alignment */
  .hero-features article{
    align-items:flex-start;
    grid-template-columns:44px 1fr;
    column-gap:14px;
  }
  .hero-features .line-icon{
    margin-top:0;
    align-self:start;
    transform:scale(.72);
    transform-origin:left top;
  }
  .hero-features strong{
    padding-top:0;
  }

  /* Slightly more compact but still premium mobile hero */
  .hero{
    padding-top:108px;
  }
  .hero .actions{
    margin-top:36px;
  }

  /* Mobile service cards polish */
  .service-card{
    border-radius:12px;
  }
  .service-card div{
    padding:82px 24px 24px;
  }

  /* References mobile carousel */
  .references{
    overflow:hidden;
  }
  .references .container{
    width:100%;
    padding-left:18px;
    padding-right:0;
  }
  .reference-head{
    width:calc(100% - 18px);
    max-width:100%;
    padding-right:18px;
  }
  .references .gallery{
    display:flex;
    gap:16px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    padding:26px 18px 14px 0;
    margin-top:28px;
  }
  .references .gallery::-webkit-scrollbar{
    height:4px;
  }
  .references .gallery::-webkit-scrollbar-thumb{
    background:rgba(201,150,66,.55);
    border-radius:99px;
  }
  .references .gallery img,
  .references .gallery img:nth-child(1),
  .references .gallery img:nth-child(4),
  .references .gallery img:nth-child(7){
    flex:0 0 82%;
    width:82%;
    height:330px;
    grid-column:auto;
    grid-row:auto;
    object-fit:cover;
    scroll-snap-align:start;
    border-radius:12px;
    box-shadow:0 18px 36px rgba(0,0,0,.12);
  }
  .references .outline-dark{
    margin:22px 18px 0 0;
    width:calc(100% - 36px);
  }

  /* Contact: form before contact data on mobile */
  .contact-inner{
    display:grid;
    grid-template-columns:1fr;
    gap:26px;
  }
  .contact-left{
    display:grid;
  }
  .contact-left .contact-cards{
    order:4;
  }
  .contact-form{
    order:3;
  }
  .contact-left .btn{
    display:none;
  }
  .contact .eyebrow{
    margin-top:0;
  }
  .contact-left>p{
    margin-bottom:8px;
  }
  .contact-form{
    padding:24px;
    border-radius:10px;
  }
  .contact-form input,
  .contact-form textarea{
    min-height:56px;
    font-size:16px;
  }
  .contact-form textarea{
    min-height:150px;
  }
  .contact-form .btn{
    width:100%;
    min-height:56px;
  }
  .contact-cards{
    grid-template-columns:1fr 1fr;
    margin-top:30px;
    border-top:1px solid rgba(255,255,255,.12);
  }
  .contact-cards article{
    border-right:1px solid rgba(255,255,255,.16);
    border-bottom:1px solid rgba(255,255,255,.12);
    padding:26px 12px;
  }
  .contact-cards article:nth-child(2n){
    border-right:0;
  }
  .contact-cards span{
    width:48px;
    height:48px;
  }
}


/* V3.2 - Mobile final alignment and contact order */
@media(max-width:900px){
  /* Hero feature icons: top of icon aligned with top of title */
  .hero-features article{
    align-items:start;
    grid-template-columns:44px 1fr;
  }
  .hero-features .line-icon{
    margin-top:3px;
    align-self:start;
    transform:scale(.66);
    transform-origin:left top;
  }
  .hero-features strong{
    padding-top:3px;
    display:block;
  }

  /* Contact: intro first, form second, contact details below */
  .contact-inner{
    display:flex;
    flex-direction:column;
    gap:28px;
  }
  .contact-left{
    display:block;
  }
  .contact-form{
    order:2;
  }
  .contact-cards{
    order:3;
    width:100%;
    grid-template-columns:1fr 1fr;
    margin-top:0;
    border-top:1px solid rgba(255,255,255,.12);
  }
  .contact-left .contact-cards{
    margin-top:28px;
  }
  .contact-left .btn{
    display:none;
  }
}


/* V3.3 - Mobile footer nav spacing */
@media(max-width:900px){
  footer nav{
    row-gap:14px;
    column-gap:34px;
    margin:26px 0 22px;
    align-items:center;
  }
  footer nav a{
    line-height:1.2;
  }
}


/* V4.1 - Category image and text corrections */
.service-card-1 img{
  object-position:center 38%;
}
.service-card-6 img{
  object-position:center 45%;
}
@media(min-width:901px){
  .service-card-1 img{
    object-position:center 34%;
  }
}


/* V4.3 - Podstran kategorije in galerija ograj */
.category-page .site-header{
  background:rgba(0,0,0,.86);
  backdrop-filter:blur(10px);
}
.category-hero{
  min-height:520px;
  position:relative;
  background-image:var(--category-hero);
  background-size:cover;
  background-position:center;
  color:white;
  display:flex;
  align-items:flex-end;
  padding:150px 0 70px;
}
.category-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.18)),linear-gradient(0deg,rgba(0,0,0,.76),rgba(0,0,0,.05));
}
.category-hero .container{
  position:relative;
  z-index:1;
}
.breadcrumb{
  display:flex;
  gap:10px;
  align-items:center;
  color:rgba(255,255,255,.72);
  font-size:14px;
  font-weight:700;
  text-transform:uppercase;
  margin-bottom:22px;
}
.breadcrumb a{color:var(--gold)}
.category-hero h1{
  font-size:64px;
  line-height:1.05;
  margin:0 0 18px;
  letter-spacing:-.04em;
}
.category-hero p{
  max-width:720px;
  font-size:21px;
  line-height:1.6;
  color:rgba(255,255,255,.86);
  margin:0;
}
.category-gallery-section{
  background:#fff;
}
.category-gallery{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:0;
}
.category-gallery button{
  appearance:none;
  border:0;
  padding:0;
  margin:0;
  background:#111;
  cursor:pointer;
  overflow:hidden;
  aspect-ratio:4/3;
}
.category-gallery button:nth-child(1),
.category-gallery button:nth-child(6){
  grid-row:span 2;
  aspect-ratio:auto;
}
.category-gallery img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .45s ease, opacity .45s ease;
}
.category-gallery button:hover img{
  transform:scale(1.045);
  opacity:.92;
}
.gallery-cta{
  margin-top:58px;
  padding:42px;
  background:#f8f8f6;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}
.gallery-cta h2{
  font-size:36px;
  margin:0 0 8px;
  letter-spacing:-.03em;
}
.gallery-cta p{
  margin:0;
  color:var(--body);
  font-size:17px;
  line-height:1.6;
}
.lightbox{
  position:fixed;
  inset:0;
  z-index:100;
  background:rgba(0,0,0,.92);
  display:none;
  align-items:center;
  justify-content:center;
  padding:32px;
}
.lightbox.is-open{display:flex}
.lightbox img{
  max-width:min(1120px,92vw);
  max-height:84vh;
  object-fit:contain;
  box-shadow:0 24px 80px rgba(0,0,0,.45);
}
.lightbox button{
  position:absolute;
  border:1px solid rgba(255,255,255,.28);
  background:rgba(0,0,0,.35);
  color:white;
  width:48px;
  height:48px;
  border-radius:50%;
  font-size:28px;
  cursor:pointer;
}
.lightbox-close{top:28px;right:28px}
.lightbox-prev{left:28px;top:50%;transform:translateY(-50%)}
.lightbox-next{right:28px;top:50%;transform:translateY(-50%)}
@media(max-width:900px){
  .category-hero{
    min-height:420px;
    padding:120px 0 48px;
  }
  .category-hero h1{font-size:44px}
  .category-hero p{font-size:18px}
  .category-gallery{
    grid-template-columns:1fr;
    gap:14px;
  }
  .category-gallery button,
  .category-gallery button:nth-child(1),
  .category-gallery button:nth-child(6){
    grid-row:auto;
    aspect-ratio:4/3;
  }
  .gallery-cta{
    display:block;
    padding:28px;
  }
  .gallery-cta .btn{
    margin-top:22px;
    width:100%;
  }
  .lightbox{padding:18px}
  .lightbox button{width:42px;height:42px;font-size:24px}
  .lightbox-close{top:18px;right:18px}
  .lightbox-prev{left:18px}
  .lightbox-next{right:18px}
}


/* V4.9 - Reference overview */
.page-header{background:rgba(0,0,0,.82);backdrop-filter:blur(10px)}
.split-head{display:grid;grid-template-columns:1fr 0.95fr;gap:60px;align-items:end;max-width:none}.split-head p:last-child{margin-bottom:26px}.project-showcase{background:#fff}.reference-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:38px 0 34px}.reference-stats article{border:1px solid rgba(0,0,0,.10);background:#f8f8f6;padding:28px 30px}.reference-stats strong{display:block;font-size:48px;line-height:1;color:#111;letter-spacing:-.04em}.reference-stats span{display:block;margin-top:10px;text-transform:uppercase;font-size:13px;font-weight:800;color:#555;letter-spacing:.03em}.reference-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}.reference-card{position:relative;display:block;min-height:360px;background:#111;overflow:hidden;border-radius:2px;color:#fff;box-shadow:0 16px 42px rgba(0,0,0,.11)}.reference-card img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;transition:transform .45s ease,filter .45s ease;filter:saturate(.92)}.reference-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.82))}.reference-card:hover img{transform:scale(1.045);filter:saturate(1)}.reference-card-content{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:34px}.reference-card-content span{display:block;color:var(--gold);text-transform:uppercase;font-size:12px;font-weight:900;letter-spacing:.04em;margin-bottom:12px}.reference-card-content h3{font-size:27px;line-height:1.12;margin:0 0 16px;letter-spacing:-.02em}.reference-card-content p{margin:0;text-transform:uppercase;font-weight:900;font-size:13px;color:#fff}.featured-reference-grid .reference-card:nth-child(1),.featured-reference-grid .reference-card:nth-child(4){grid-row:span 2;min-height:540px}.reference-actions{display:flex;gap:18px;align-items:center;justify-content:center;margin-top:38px}.reference-actions .outline-dark{margin:0}.references-hero{background-position:center}.breadcrumb{display:flex;gap:10px;align-items:center;margin-bottom:32px;text-transform:uppercase;font-weight:800;font-size:13px;color:#777}.breadcrumb a{color:var(--gold)}.breadcrumb strong{color:#111}.reference-filters{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 32px}.reference-filters button{border:1px solid rgba(0,0,0,.14);background:#fff;padding:13px 18px;text-transform:uppercase;font-weight:900;font-size:12px;letter-spacing:.02em;cursor:pointer;color:#222}.reference-filters button.active,.reference-filters button:hover{background:#111;color:#fff;border-color:#111}.all-reference-grid .reference-card{min-height:340px}.reference-stats-page{margin-top:0}.category-cta{padding:80px 0;background:#080909;color:#fff;text-align:center}.category-cta h2{font-size:42px;line-height:1.15;margin:0 0 16px;letter-spacing:-.03em}.category-cta p{font-size:18px;color:#ddd;max-width:720px;margin:0 auto 30px;line-height:1.65}
@media(max-width:1000px){.split-head{grid-template-columns:1fr;gap:8px}.reference-grid{grid-template-columns:repeat(2,1fr)}.featured-reference-grid .reference-card:nth-child(1),.featured-reference-grid .reference-card:nth-child(4){grid-row:auto;min-height:360px}.reference-stats{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:700px){.reference-stats{grid-template-columns:1fr}.reference-grid{grid-template-columns:1fr}.reference-card,.all-reference-grid .reference-card{min-height:320px}.reference-card-content{padding:26px}.reference-card-content h3{font-size:24px}.reference-actions{display:grid}.reference-actions .btn{width:100%}.reference-filters{overflow-x:auto;flex-wrap:nowrap;padding-bottom:8px}.reference-filters button{white-space:nowrap}.category-cta h2{font-size:34px}}


/* V5.0 - Project detail pages */
.project-detail-hero{min-height:560px;background-size:cover;background-position:center;position:relative;display:flex;align-items:end;padding:150px 0 70px;color:#fff}
.project-detail-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.78))}
.project-detail-hero .container{position:relative;z-index:1;max-width:960px;margin-left:max(5vw,calc((100vw - var(--container))/2))}
.project-detail-hero h1{font-size:64px;line-height:1.02;margin:12px 0 18px;letter-spacing:-.045em;max-width:900px}
.project-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.project-tags span{border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.10);color:#fff;padding:9px 12px;text-transform:uppercase;font-weight:900;font-size:11px;letter-spacing:.04em}
.project-detail-section{background:#fff}.project-overview{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:start}.project-overview h2{font-size:46px;margin:0 0 18px;letter-spacing:-.035em}.project-overview p{font-size:19px;line-height:1.75;color:var(--body);margin:0}.made-list{background:#f8f8f6;border:1px solid rgba(0,0,0,.08);padding:34px}.made-list h3{font-size:24px;margin:0 0 18px}.made-list ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}.made-list li{font-weight:800;color:#222}.made-list li:before{content:"✓";color:var(--gold);font-weight:900;margin-right:10px}.project-gallery-head{margin-top:70px;margin-bottom:24px;display:flex;align-items:end;justify-content:space-between;gap:24px}.project-gallery-head h2{font-size:40px;margin:0;letter-spacing:-.035em}.project-gallery-head p{margin:8px 0 0;color:var(--body)}.project-gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.project-gallery-grid button{border:0;padding:0;background:#111;cursor:pointer;overflow:hidden;aspect-ratio:4/3}.project-gallery-grid button:nth-child(1),.project-gallery-grid button:nth-child(15){grid-row:span 2;aspect-ratio:auto}.project-gallery-grid img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}.project-gallery-grid button:hover img{transform:scale(1.045)}.project-nav{display:flex;justify-content:space-between;gap:16px;margin-top:36px}.project-nav a{color:#111;font-weight:900;text-transform:uppercase;font-size:13px}.project-detail-cta{padding:86px 0;background:#080909;color:#fff;text-align:center}.project-detail-cta h2{font-size:42px;margin:0 0 14px;letter-spacing:-.035em}.project-detail-cta p{max-width:720px;margin:0 auto 30px;color:#ddd;font-size:18px;line-height:1.7}
@media(max-width:900px){.project-detail-hero{min-height:460px;padding:130px 0 54px}.project-detail-hero h1{font-size:44px}.project-overview{grid-template-columns:1fr;gap:32px}.project-gallery-grid{grid-template-columns:1fr;gap:14px}.project-gallery-grid button,.project-gallery-grid button:nth-child(1),.project-gallery-grid button:nth-child(15){grid-row:auto;aspect-ratio:4/3}.project-gallery-head{display:block}.project-detail-cta h2{font-size:34px}.project-nav{display:grid}}

/* V5.0.3 - Featured references refinement */
.featured-reference-grid{
  grid-template-columns:1.25fr 1fr 1fr;
  grid-auto-rows:260px;
  max-width:none;
  width:100%;
  margin-left:0;
  margin-right:0;
}
.featured-reference-grid .reference-card{
  min-height:0;
  height:100%;
}
.featured-reference-grid .reference-card:nth-child(1){
  grid-row:span 2;
  min-height:0;
}
.featured-reference-grid .reference-card:nth-child(4){
  grid-row:auto;
  min-height:0;
}
@media(max-width:1000px){
  .featured-reference-grid{
    grid-template-columns:repeat(2,1fr);
    grid-auto-rows:auto;
    max-width:none;
  }
  .featured-reference-grid .reference-card,
  .featured-reference-grid .reference-card:nth-child(1),
  .featured-reference-grid .reference-card:nth-child(4){
    grid-row:auto;
    min-height:360px;
  }
}
@media(max-width:700px){
  .featured-reference-grid{grid-template-columns:1fr}
  .featured-reference-grid .reference-card,
  .featured-reference-grid .reference-card:nth-child(1),
  .featured-reference-grid .reference-card:nth-child(4){min-height:320px}
}


/* V5.0.4 - Featured references grid aligned with stats width */
.featured-reference-grid{max-width:none;width:100%;margin-left:0;margin-right:0;}

/* V5.0.5 - Home spacing refinements */
@media (min-width: 901px){
  /* Add a little more breathing room between hero buttons and the feature bar */
  .hero{
    min-height: 930px;
  }
  .hero-features{
    bottom: 0;
  }

  /* Contact: place contact details directly below the left intro, while form stays aligned on the right */
  .contact-inner{
    grid-template-areas:
      "contactIntro contactForm"
      "contactCards contactForm";
    grid-template-rows: auto 1fr;
    align-items: start;
  }
  .contact-left{
    grid-area: contactIntro;
  }
  .contact-form{
    grid-area: contactForm;
  }
  .contact-cards{
    grid-area: contactCards;
    margin-top: 34px;
    align-self: start;
  }
}

/* V5.0.6 - Extend hero background below feature bar */
@media (min-width: 901px){
  .hero{
    min-height: 990px;
  }
  .hero-features{
    bottom: 60px;
  }
}

/* V5.0.7 - Mobile featured references carousel */
@media (max-width: 700px){
  .project-showcase .reference-head{
    margin-bottom: 18px;
  }
  .project-showcase .reference-stats{
    margin-bottom: 28px;
  }
  .featured-reference-grid{
    display: flex;
    grid-template-columns: none;
    gap: 16px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 20px;
    padding: 0 20px 16px;
    margin-left: -20px;
    margin-right: -20px;
    -webkit-overflow-scrolling: touch;
  }
  .featured-reference-grid::-webkit-scrollbar{
    height: 6px;
  }
  .featured-reference-grid::-webkit-scrollbar-thumb{
    background: rgba(0,0,0,.22);
    border-radius: 999px;
  }
  .featured-reference-grid .reference-card,
  .featured-reference-grid .reference-card:nth-child(1),
  .featured-reference-grid .reference-card:nth-child(4){
    flex: 0 0 calc(100vw - 40px);
    width: calc(100vw - 40px);
    min-height: 70vh;
    max-height: 620px;
    scroll-snap-align: start;
  }
  .featured-reference-grid .reference-card-content{
    padding: 30px;
  }
  .featured-reference-grid .reference-card-content h3{
    font-size: 30px;
  }
}

@media (max-width: 420px){
  .featured-reference-grid .reference-card,
  .featured-reference-grid .reference-card:nth-child(1),
  .featured-reference-grid .reference-card:nth-child(4){
    min-height: 64vh;
  }
}


/* V5.0.9 - Mobile references refinements */
@media (min-width: 701px){
  .featured-reference-grid .reference-card:nth-child(n+6){
    display:none;
  }
}

@media (max-width: 700px){
  .project-showcase .reference-stats{
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin: 24px 0 24px;
  }
  .project-showcase .reference-stats article{
    padding: 14px 10px;
  }
  .project-showcase .reference-stats strong{
    font-size: 27px;
    letter-spacing: -0.04em;
  }
  .project-showcase .reference-stats span{
    font-size: 9px;
    line-height: 1.25;
    margin-top: 7px;
  }
  .featured-reference-grid .reference-card:nth-child(n+6){
    display:block;
  }
  .reference-actions{
    margin-top: 26px;
    margin-bottom: 26px;
  }
  .reference-actions .btn{
    width:auto;
    justify-self:center;
  }
}

@media (max-width: 420px){
  .project-showcase .reference-stats{
    gap: 7px;
  }
  .project-showcase .reference-stats article{
    padding: 12px 7px;
  }
  .project-showcase .reference-stats strong{
    font-size: 23px;
  }
  .project-showcase .reference-stats span{
    font-size: 8px;
  }
}

/* V5.1.0 - Mobile final reference spacing and stats alignment */
@media (max-width: 700px){
  .project-showcase{
    padding-bottom: 34px;
  }
  .process{
    padding-top: 42px;
  }
  .project-showcase .reference-stats{
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    max-width: 100%;
    gap: 7px;
  }
  .project-showcase .reference-stats article{
    min-width: 0;
    box-sizing: border-box;
    padding: 12px 7px;
  }
  .project-showcase .reference-stats strong{
    font-size: 23px;
  }
  .project-showcase .reference-stats span{
    font-size: 8px;
    line-height: 1.2;
    word-break: normal;
  }
  .reference-actions{
    margin-top: 22px;
    margin-bottom: 0;
  }
}

@media (max-width: 380px){
  .project-showcase .reference-stats{
    gap: 6px;
  }
  .project-showcase .reference-stats article{
    padding: 11px 5px;
  }
  .project-showcase .reference-stats strong{
    font-size: 21px;
  }
  .project-showcase .reference-stats span{
    font-size: 7px;
  }
}

/* V5.1.1 - Mobile stats cards aligned with reference carousel width */
@media (max-width: 700px){
  .project-showcase .reference-stats{
    width: calc(100vw - 40px);
    max-width: calc(100vw - 40px);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
  }
}

/* V5.2 - Premium subtle animations */
@media (prefers-reduced-motion: no-preference){
  :root{--ease-premium:cubic-bezier(.22,.61,.36,1)}

  .hero .eyebrow,
  .hero h1,
  .hero .lead,
  .hero .actions,
  .hero-features{
    opacity:0;
    transform:translateY(18px);
    animation:premiumFadeUp .72s var(--ease-premium) forwards;
  }
  .hero h1{animation-delay:.08s}
  .hero .lead{animation-delay:.16s}
  .hero .actions{animation-delay:.24s}
  .hero-features{animation-delay:.34s}

  @keyframes premiumFadeUp{
    to{opacity:1;transform:translateY(0)}
  }

  .btn,
  .nav-cta,
  .mobile-menu-button{
    transition:transform .24s var(--ease-premium),box-shadow .24s var(--ease-premium),background-color .24s var(--ease-premium),border-color .24s var(--ease-premium),color .24s var(--ease-premium);
  }
  .btn:hover,
  .nav-cta:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 26px rgba(0,0,0,.16);
  }
  .primary:hover{background:var(--gold2)}
  .secondary:hover,
  .outline-dark:hover{
    background:var(--gold);
    color:#fff;
  }

  .service-card img,
  .reference-card img,
  .project-card img,
  .gallery-card img,
  .project-gallery a img{
    transition:transform .75s var(--ease-premium),filter .75s var(--ease-premium);
    will-change:transform;
  }
  .service-card:hover img,
  .reference-card:hover img,
  .project-card:hover img,
  .gallery-card:hover img,
  .project-gallery a:hover img{
    transform:scale(1.055);
    filter:saturate(.98) contrast(1.04);
  }
  .service-card span,
  .reference-card .reference-arrow,
  .project-card .project-arrow{
    transition:transform .28s var(--ease-premium),color .28s var(--ease-premium);
  }
  .service-card:hover span,
  .reference-card:hover .reference-arrow,
  .project-card:hover .project-arrow{
    transform:translateX(5px);
    color:var(--gold2);
  }

  .service-card,
  .reference-card,
  .project-card,
  .steps article,
  .contact-form,
  .contact-cards article,
  .reference-stats article,
  .project-gallery a,
  .category-card{
    transition:transform .32s var(--ease-premium),box-shadow .32s var(--ease-premium),border-color .32s var(--ease-premium);
  }
  .reference-card:hover,
  .project-card:hover,
  .project-gallery a:hover,
  .category-card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 34px rgba(0,0,0,.14);
  }

  .reveal-on-scroll{
    opacity:0;
    transform:translateY(22px);
    transition:opacity .7s var(--ease-premium),transform .7s var(--ease-premium);
  }
  .reveal-on-scroll.is-visible{
    opacity:1;
    transform:translateY(0);
  }
  .reveal-on-scroll[data-reveal-delay="1"]{transition-delay:.06s}
  .reveal-on-scroll[data-reveal-delay="2"]{transition-delay:.12s}
  .reveal-on-scroll[data-reveal-delay="3"]{transition-delay:.18s}
  .reveal-on-scroll[data-reveal-delay="4"]{transition-delay:.24s}
  .reveal-on-scroll[data-reveal-delay="5"]{transition-delay:.30s}
  .reveal-on-scroll[data-reveal-delay="6"]{transition-delay:.36s}

  .contact-form input:focus,
  .contact-form textarea:focus{
    outline:none;
    border-color:var(--gold);
    box-shadow:0 0 0 3px rgba(201,150,66,.12);
  }
}

@media(max-width:900px) and (prefers-reduced-motion: no-preference){
  .btn:active,
  .service-card:active,
  .reference-card:active,
  .project-card:active{
    transform:scale(.985);
  }
}

/* V5.2.1 - Desktop hero feature bar alignment fix */
@media (min-width: 901px) and (prefers-reduced-motion: no-preference){
  .hero-features{
    transform: translate(-50%, 18px);
    animation-name: premiumHeroFeaturesFadeUp;
  }
  @keyframes premiumHeroFeaturesFadeUp{
    to{
      opacity: 1;
      transform: translate(-50%, 0);
    }
  }
}


/* V5.3 - Mikro izboljšave UX */
html{scroll-padding-top:96px}
a,button,input,textarea{-webkit-tap-highlight-color:rgba(201,150,66,.18)}
.skip-link{position:fixed;left:16px;top:12px;z-index:9999;transform:translateY(-140%);background:var(--gold);color:#fff;padding:12px 16px;font-weight:900;text-transform:uppercase;border-radius:3px;box-shadow:0 12px 28px rgba(0,0,0,.25)}
.skip-link:focus{transform:translateY(0);outline:2px solid #fff;outline-offset:2px}
:target{scroll-margin-top:96px}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.service-card,.reference-card,.project-card,.gallery-card,.project-gallery-grid button{touch-action:manipulation}
.is-tapped{transform:scale(.985)!important}
.contact-form input,.contact-form textarea{transition:border-color .22s ease,box-shadow .22s ease,background-color .22s ease}
.contact-form input:focus,.contact-form textarea:focus{background:rgba(255,255,255,.035)}
.contact-form textarea{resize:vertical}
.lightbox.is-open img{animation:lightboxImageIn .22s ease both}
@keyframes lightboxImageIn{from{opacity:.65;transform:scale(.985)}to{opacity:1;transform:scale(1)}}
body.lightbox-open,body.menu-open{overflow:hidden}
.mobile-menu-button[aria-expanded="true"]{background:var(--gold);border-color:var(--gold);color:#fff}
@media(max-width:900px){
  .site-header.is-menu-open nav,
  .site-header.is-menu-open .nav-cta{
    display:flex!important;
  }
  .site-header.is-menu-open nav{
    position:fixed;
    top:86px;
    left:18px;
    right:18px;
    flex-direction:column;
    gap:0;
    padding:14px;
    background:rgba(7,8,9,.96);
    border:1px solid rgba(255,255,255,.14);
    border-radius:8px;
    box-shadow:0 22px 46px rgba(0,0,0,.32);
    backdrop-filter:blur(14px);
  }
  .site-header.is-menu-open nav a{
    padding:16px 14px;
    border-bottom:1px solid rgba(255,255,255,.09);
  }
  .site-header.is-menu-open nav a:last-child{border-bottom:0}
  .site-header.is-menu-open .nav-cta{
    position:fixed;
    top:calc(86px + 246px);
    left:32px;
    right:32px;
    justify-content:center;
    margin:0;
    background:var(--gold);
    color:#fff;
    border-color:var(--gold);
  }
  html{scroll-padding-top:86px}
  :target{scroll-margin-top:86px}
}
@media(max-width:520px){
  .site-header.is-menu-open nav{top:78px}
  .site-header.is-menu-open .nav-cta{top:calc(78px + 246px)}
}
@media (prefers-reduced-motion: no-preference){
  .site-header{transition:background-color .24s ease,box-shadow .24s ease,backdrop-filter .24s ease}
  .site-header.is-scrolled{background:rgba(7,8,9,.88);box-shadow:0 10px 28px rgba(0,0,0,.16);backdrop-filter:blur(12px)}
  .lightbox button{transition:transform .2s ease,background-color .2s ease,border-color .2s ease}
  .lightbox button:hover{transform:scale(1.04)}
  .lightbox-prev:hover{transform:translateY(-50%) scale(1.04)}
  .lightbox-next:hover{transform:translateY(-50%) scale(1.04)}
}

/* v5.3.1 - mobile menu CTA removed */
@media (max-width: 900px) {
  .site-header.is-menu-open .nav-cta {
    display: none !important;
  }
}

/* v6.0 production: reference section intro aligned under title */
.project-showcase .reference-head-stacked{
  max-width:760px;
}
.project-showcase .reference-head-stacked p:not(.eyebrow){
  max-width:700px;
  margin-top:0;
  margin-bottom:0;
}