@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&display=swap");
/* ============================================================
   DEKORIVA — REDIZAJN OVERRIDE (pravac: odvažnije / "wow")
   Nedestruktivno: samo dograđuje postojeći build.
   v1
   ============================================================ */

:root{
  --dk-orange:#f9a01b;
  --dk-orange-bright:#ffbe4d;
  --dk-orange-deep:#e07d0a;
}

/* ---------- HERO ---------- */

/* Hero brojke (2002 / 20+ / 80+) — spriječi horizontalni overflow na mobilnom */
.dk-hero-stats{ gap:1.25rem; flex-wrap:nowrap; }
.dk-hero-stat-item.pl-10{ padding-left:1.1rem !important; }
.dk-hero-stat-num{ font-size:1.5rem !important; line-height:1.1 !important; }
@media (min-width:640px){
  .dk-hero-stats{ gap:1.75rem; }
  .dk-hero-stat-item.pl-10{ padding-left:1.75rem !important; }
  .dk-hero-stat-num{ font-size:1.9rem !important; }
}
@media (min-width:1024px){
  .dk-hero-stats{ gap:2.5rem; }
  .dk-hero-stat-item.pl-10{ padding-left:2.5rem !important; }
  .dk-hero-stat-num{ font-size:2.25rem !important; }
}

/* Veći, odvažniji naslov */
section.h-screen h1.heading-display{
  font-size:clamp(2.9rem, 6.4vw, 5.5rem) !important;
  line-height:.96 !important;
  letter-spacing:-.045em !important;
  font-weight:800 !important;
}

/* Kurzivni akcenat u heroju — topli narandžasti gradijent + suptilan sjaj */
section.h-screen h1 .font-serif-editorial{
  background:linear-gradient(120deg, var(--dk-orange-bright) 0%, var(--dk-orange) 55%, var(--dk-orange-deep) 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent !important;
  filter:drop-shadow(0 3px 22px rgba(249,160,27,.35));
}

/* Eyebrow ("Zanatlija koji ne pravi kompromise") — više prisustva */
section.h-screen span.font-serif-editorial.italic[class*="white/55"]{
  color:rgba(255,255,255,.72) !important;
  font-size:clamp(1rem,1.35vw,1.3rem) !important;
  letter-spacing:.005em;
}

/* Statistika (2002 / 20+ / 80+) — krupnije i teže */
section.h-screen .stat-number{
  font-family:var(--font-display) !important;
  font-size:clamp(2.4rem,3.4vw,3.4rem) !important;
  font-weight:800 !important;
  letter-spacing:-.03em !important;
}

/* Dramatičniji vignette preko videa — sidri tekst, jači kontrast */
section.h-screen::after{
  content:"";
  position:absolute; inset:0; z-index:5; pointer-events:none;
  background:
    radial-gradient(130% 105% at 18% 32%, transparent 38%, rgba(0,0,0,.42) 100%),
    linear-gradient(to top, rgba(20,20,20,.88) 0%, rgba(20,20,20,.30) 34%, transparent 55%);
}

/* ---------- DUGMAD ---------- */

.btn-primary{
  background:linear-gradient(135deg, var(--dk-orange-bright) 0%, var(--dk-orange) 58%, var(--dk-orange-deep) 100%) !important;
  padding:1.05rem 2.35rem !important;
  font-size:.95rem !important;
  font-weight:700 !important;
  letter-spacing:.015em !important;
  box-shadow:0 10px 34px -10px rgba(249,160,27,.60) !important;
  transition:transform .18s cubic-bezier(.23,1,.32,1), box-shadow .25s ease !important;
}
.btn-primary:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 18px 46px -10px rgba(249,160,27,.78) !important;
}

/* Ghost / sekundarno dugme ("Pogledaj projekte") — jasnija ivica na hover */
section.h-screen a[class*="border"]:hover{
  border-color:var(--dk-orange) !important;
}

/* ---------- NASLOVI SEKCIJA ---------- */

h2.heading-display, h2.heading-editorial{
  font-size:clamp(2rem, 4.6vw, 3.9rem) !important;
  letter-spacing:-.035em !important;
  font-weight:700 !important;
}

/* Narandžasti akcenat unutar naslova (npr. "gotov proizvod.", "kvalitet izrade.") */
h1 span[class*="E8742C"], h2 span[class*="E8742C"]{
  background:linear-gradient(120deg, var(--dk-orange-bright), var(--dk-orange-deep));
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent !important;
}

/* Mali "eyebrow" labeli (USLUGE, PROCES, PROIZVODNJA...) — jače, sa razmakom */
[class*="tracking-wider"][class*="uppercase"][class*="E8742C"],
.uppercase[class*="E8742C"]{
  letter-spacing:.22em !important;
  font-weight:700 !important;
}

/* ============================================================
   LOGO — zvanični horizontalni logo (adaptivan) + signage favicon
   ============================================================ */

/* HEADER logo: sakrij ikonicu+tekst, prikazi horizontalni SVG */
header a.group.flex-shrink-0{
  display:inline-block !important;
  width:200px; height:42px;
  background-repeat:no-repeat; background-position:left center; background-size:contain;
}
header a.group.flex-shrink-0 > *{ display:none !important; }

/* header proziran (preko heroja) -> bijeli wordmark */
header[class*="bg-transparent"] a.group.flex-shrink-0{
  background-image:url(brand/logo-horizontal-light.svg);
}
/* header svijetao (skrolovan) -> tamni wordmark */
header[class*="FAF8F5"] a.group.flex-shrink-0{
  background-image:url(brand/logo-horizontal-dark.svg);
}

/* FOOTER logo (tamna podloga) -> bijeli horizontalni */
footer div[class*="gap-2.5"][class*="mb-6"]{
  width:210px; height:44px;
  background:url(brand/logo-horizontal-light.svg) left center/contain no-repeat;
}
footer div[class*="gap-2.5"][class*="mb-6"] > *{ display:none !important; }


/* ============================================================
   TIPOGRAFIJA — tekst na Manrope (naslovi Bricolage, akcenat Fraunces ostaju)
   ============================================================ */
:root{ --font-sans:"Manrope", system-ui, sans-serif; }
body, .font-sans{ font-family:"Manrope", system-ui, sans-serif !important; }
/* zadrzi mono/tehnicki osjecaj gdje je bio Space Grotesk kao mono ako treba — brojevi ostaju Bricolage preko .stat-number */

/* ============================================================
   PRELOADER — signage znak umjesto stare ikonice, bez prstena,
   mekano "disanje" + zlatni sjaj (bez kruženja)
   ============================================================ */
/* Skopirano striktno na preloader (z-[100] + bg-[#1A1A1A]) da ne pokupi lightbox/modal koji takodje koriste z-[100] */
div[class*="z-[100]"][class*="1A1A1A"] svg{ display:none !important; }              /* ukloni rotirajući prsten */
div[class*="z-[100]"][class*="1A1A1A"] img{
  content:url(brand/logo-signage.svg);
  width:88px !important; height:88px !important;
  border-radius:0 !important;
  animation:dk-breathe 1.8s ease-in-out infinite;
}
div[class*="z-[100]"][class*="1A1A1A"] div[class*="mb-8"]{ position:relative; }
div[class*="z-[100]"][class*="1A1A1A"] div[class*="mb-8"]::before{
  content:""; position:absolute; inset:-40%; z-index:0; pointer-events:none;
  background:radial-gradient(circle, rgba(249,160,27,.38) 0%, transparent 62%);
  animation:dk-glow 1.8s ease-in-out infinite;
}
@keyframes dk-breathe{ 0%,100%{transform:scale(1)} 50%{transform:scale(1.08)} }
@keyframes dk-glow{ 0%,100%{opacity:.2; transform:scale(.85)} 50%{opacity:.65; transform:scale(1.2)} }

/* ============================================================
   FOOTER WATERMARK — logo (slovni oblik brenda) umjesto Bricolage teksta
   ============================================================ */
footer div[class*="text-[18vw]"]{
  color:transparent !important;
  background:url(brand/logo-full-white.svg) center bottom / 88% auto no-repeat;
  opacity:.05;
}

/* ============================================================
   PROCES — "Šest koraka": kompaktan "spotlight" stepper
   (aktivan korak lijevo, kompaktna traka čvorova desno; auto-cycle
   iz builda pokreće promjenu, klik na čvor ručno mijenja korak)
   ============================================================ */

/* crossfade + suptilan slide kad se aktivan korak promijeni (key-remount) */
.dk-step-fade{ animation:dk-step-in .5s cubic-bezier(.23,1,.32,1); }
@keyframes dk-step-in{
  0%{ opacity:0; transform:translateY(8px); }
  100%{ opacity:1; transform:translateY(0); }
}

/* traka čvorova na mobilnom -> horizontalni scroll bez vidljive scrollbar trake */
.dk-no-scrollbar{ -ms-overflow-style:none; scrollbar-width:none; }
.dk-no-scrollbar::-webkit-scrollbar{ display:none; }

/* ---- unifikacija: mono brojevi (01–04) na Manrope; Space Grotesk se gasi ---- */
.font-mono{ font-family:"Manrope", system-ui, sans-serif !important; }

/* ============================================================
   HERO akcenat na MOBILNOM — "od ideje do realizacije" u svoj red, veće
   ============================================================ */
@media (max-width:640px){
  section.h-screen h1 .font-serif-editorial{
    display:block !important;
    font-size:.82em !important;
    line-height:1.02 !important;
    margin-top:.14em !important;
  }
}

/* ============================================================
   NASLOVNA — strip "Materijali i okovi": logotipi umjesto imena brendova
   (redoslijed: EGGER, KRONOSPAN, BLUM, HETTICH, HÄFELE, FRANKE, GROHE)
   ============================================================ */
[class*="lg:grid-cols-7"] > div > div{
  background-repeat:no-repeat; background-position:center;
  background-size:contain; background-origin:content-box;
  padding:26px 22px !important; min-height:108px;
}
[class*="lg:grid-cols-7"] > div > div > span{ display:none !important; }
[class*="lg:grid-cols-7"] > div:nth-child(1) > div{ background-image:url(manus-storage/egger_8d87566f.png); }
[class*="lg:grid-cols-7"] > div:nth-child(2) > div{ background-image:url(manus-storage/kronospan_d27f5e96.png); }
[class*="lg:grid-cols-7"] > div:nth-child(3) > div{ background-image:url(manus-storage/blum_163e19d8.png); }
[class*="lg:grid-cols-7"] > div:nth-child(4) > div{ background-image:url(manus-storage/hettich_fa9b0d4b.png); }
[class*="lg:grid-cols-7"] > div:nth-child(5) > div{ background-image:url(manus-storage/hafele_780017b8.png); }
[class*="lg:grid-cols-7"] > div:nth-child(6) > div{ background-image:url(manus-storage/franke_795a9029.png); }
[class*="lg:grid-cols-7"] > div:nth-child(7) > div{ background-image:url(manus-storage/grohe_e8872839.png); }

/* ============================================================
   NADNASLOVI (eyebrow labeli iznad naslova sekcija) — uklonjeni
   Postoje dva razlicita patterna na sajtu:
   1) .micro-label klasa — koristi se samo na Pocetnoj
   2) rucno sastavljen pattern (crtica + tekst) — koristi se na
      SVIM ostalim stranicama (Usluge, Portfolio, Materijali i okovi,
      O nama, Kontakt, Blog...). Nema zajednicku klasu, pa se hvata
      strukturno: red koji sadrzi kao prvo dijete narandzastu h-px crticu.
   ============================================================ */
.micro-label{ display:none !important; }
div[class*="items-center"]:has(> div[class*="h-px"][class*="f9a01b"]){ display:none !important; }

/* ============================================================
   O NAMA — "Vrste drveta": talasaste trake (zamjena za kocku)
   Klikom se traka prosiri, ostale se stisnu; talasaste ivice
   dijele trake kao pocijepan/preklopljen papir.
   ============================================================ */
.dk-wood-ribbons{ position:relative; width:100%; }
.dk-wood-ribbons-row{
  display:flex; flex-direction:row; height:500px;
  border-radius:18px; overflow:hidden; background:#1A1A1A;
  box-shadow:0 24px 60px -24px rgba(26,20,14,.45);
}
.dk-wood-ribbon{
  position:relative; flex:1 1 0%; min-width:0; margin-left:-16px;
  border:none; padding:0; cursor:pointer; background-color:#2a2622;
  background-size:cover; background-position:center;
  clip-path:polygon(calc(0% + 10.52px) 0%,calc(0% + 7.36px) 4.167%,calc(0% + 3.36px) 8.333%,calc(0% - 1.02px) 12.5%,calc(0% - 5.29px) 16.667%,calc(0% - 8.95px) 20.833%,calc(0% - 11.58px) 25%,calc(0% - 12.89px) 29.167%,calc(0% - 12.72px) 33.333%,calc(0% - 11.08px) 37.5%,calc(0% - 8.18px) 41.667%,calc(0% - 4.34px) 45.833%,0% 50%,calc(0% + 4.34px) 54.167%,calc(0% + 8.18px) 58.333%,calc(0% + 11.08px) 62.5%,calc(0% + 12.72px) 66.667%,calc(0% + 12.89px) 70.833%,calc(0% + 11.58px) 75%,calc(0% + 8.95px) 79.167%,calc(0% + 5.29px) 83.333%,calc(0% + 1.02px) 87.5%,calc(0% - 3.36px) 91.667%,calc(0% - 7.36px) 95.833%,calc(0% - 10.52px) 100%,calc(100% - 10.52px) 100%,calc(100% - 7.36px) 95.833%,calc(100% - 3.36px) 91.667%,calc(100% + 1.02px) 87.5%,calc(100% + 5.29px) 83.333%,calc(100% + 8.95px) 79.167%,calc(100% + 11.58px) 75%,calc(100% + 12.89px) 70.833%,calc(100% + 12.72px) 66.667%,calc(100% + 11.08px) 62.5%,calc(100% + 8.18px) 58.333%,calc(100% + 4.34px) 54.167%,100% 50%,calc(100% - 4.34px) 45.833%,calc(100% - 8.18px) 41.667%,calc(100% - 11.08px) 37.5%,calc(100% - 12.72px) 33.333%,calc(100% - 12.89px) 29.167%,calc(100% - 11.58px) 25%,calc(100% - 8.95px) 20.833%,calc(100% - 5.29px) 16.667%,calc(100% - 1.02px) 12.5%,calc(100% + 3.36px) 8.333%,calc(100% + 7.36px) 4.167%,calc(100% + 10.52px) 0%);
  display:flex; align-items:flex-end; text-align:left;
  transition:flex-grow .7s cubic-bezier(.22,1,.36,1);
}
.dk-wood-ribbon:first-child{
  margin-left:0;
  clip-path:polygon(0% 0%,0% 4.167%,0% 8.333%,0% 12.5%,0% 16.667%,0% 20.833%,0% 25%,0% 29.167%,0% 33.333%,0% 37.5%,0% 41.667%,0% 45.833%,0% 50%,0% 54.167%,0% 58.333%,0% 62.5%,0% 66.667%,0% 70.833%,0% 75%,0% 79.167%,0% 83.333%,0% 87.5%,0% 91.667%,0% 95.833%,0% 100%,calc(100% - 10.52px) 100%,calc(100% - 7.36px) 95.833%,calc(100% - 3.36px) 91.667%,calc(100% + 1.02px) 87.5%,calc(100% + 5.29px) 83.333%,calc(100% + 8.95px) 79.167%,calc(100% + 11.58px) 75%,calc(100% + 12.89px) 70.833%,calc(100% + 12.72px) 66.667%,calc(100% + 11.08px) 62.5%,calc(100% + 8.18px) 58.333%,calc(100% + 4.34px) 54.167%,100% 50%,calc(100% - 4.34px) 45.833%,calc(100% - 8.18px) 41.667%,calc(100% - 11.08px) 37.5%,calc(100% - 12.72px) 33.333%,calc(100% - 12.89px) 29.167%,calc(100% - 11.58px) 25%,calc(100% - 8.95px) 20.833%,calc(100% - 5.29px) 16.667%,calc(100% - 1.02px) 12.5%,calc(100% + 3.36px) 8.333%,calc(100% + 7.36px) 4.167%,calc(100% + 10.52px) 0%);
}
.dk-wood-ribbon:last-child{
  clip-path:polygon(calc(0% + 10.52px) 0%,calc(0% + 7.36px) 4.167%,calc(0% + 3.36px) 8.333%,calc(0% - 1.02px) 12.5%,calc(0% - 5.29px) 16.667%,calc(0% - 8.95px) 20.833%,calc(0% - 11.58px) 25%,calc(0% - 12.89px) 29.167%,calc(0% - 12.72px) 33.333%,calc(0% - 11.08px) 37.5%,calc(0% - 8.18px) 41.667%,calc(0% - 4.34px) 45.833%,0% 50%,calc(0% + 4.34px) 54.167%,calc(0% + 8.18px) 58.333%,calc(0% + 11.08px) 62.5%,calc(0% + 12.72px) 66.667%,calc(0% + 12.89px) 70.833%,calc(0% + 11.58px) 75%,calc(0% + 8.95px) 79.167%,calc(0% + 5.29px) 83.333%,calc(0% + 1.02px) 87.5%,calc(0% - 3.36px) 91.667%,calc(0% - 7.36px) 95.833%,calc(0% - 10.52px) 100%,100% 100%,100% 95.833%,100% 91.667%,100% 87.5%,100% 83.333%,100% 79.167%,100% 75%,100% 70.833%,100% 66.667%,100% 62.5%,100% 58.333%,100% 54.167%,100% 50%,100% 45.833%,100% 41.667%,100% 37.5%,100% 33.333%,100% 29.167%,100% 25%,100% 20.833%,100% 16.667%,100% 12.5%,100% 8.333%,100% 4.167%,100% 0%);
}
.dk-wood-ribbon.is-active{ flex-grow:5; }
.dk-wood-ribbon-overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(26,26,26,.12) 0%, rgba(26,26,26,.5) 55%, rgba(26,26,26,.9) 100%);
  transition:background .4s ease;
}
.dk-wood-ribbon.is-active .dk-wood-ribbon-overlay{
  background:linear-gradient(180deg, rgba(26,26,26,.08) 0%, rgba(26,26,26,.3) 45%, rgba(26,26,26,.93) 100%);
}
@media (hover:hover){
  .dk-wood-ribbon:not(.is-active):hover .dk-wood-ribbon-overlay{
    background:linear-gradient(180deg, rgba(249,160,27,.1) 0%, rgba(26,26,26,.35) 55%, rgba(26,26,26,.85) 100%);
  }
}
.dk-wood-ribbon-content{
  position:relative; z-index:2; width:100%;
  padding:20px 10px 24px 14px;
  display:flex; flex-direction:column; align-items:flex-start;
  transition:padding .5s ease;
}
.dk-wood-ribbon.is-active .dk-wood-ribbon-content{ padding:32px 40px 40px 44px; max-width:640px; }
.dk-wood-ribbon-icon{ width:22px; height:22px; color:#f9a01b; margin-bottom:12px; flex-shrink:0; transition:all .4s ease; }
.dk-wood-ribbon.is-active .dk-wood-ribbon-icon{ width:30px; height:30px; margin-bottom:16px; }
.dk-wood-ribbon-label{
  font-family:var(--font-display); font-weight:700; color:#fff;
  font-size:.76rem; letter-spacing:.02em; line-height:1.2;
  writing-mode:vertical-rl; text-orientation:mixed; white-space:nowrap;
  transition:font-size .4s ease;
}
.dk-wood-ribbon.is-active .dk-wood-ribbon-label{
  writing-mode:horizontal-tb; font-size:1.7rem; margin-bottom:14px; white-space:normal; line-height:1.15;
}
.dk-wood-ribbon-desc{
  font-size:.95rem; color:rgba(255,255,255,.68); max-width:480px; line-height:1.6;
  opacity:0; max-height:0; overflow:hidden; transition:opacity .35s ease, max-height .35s ease;
}
.dk-wood-ribbon.is-active .dk-wood-ribbon-desc{ opacity:1; max-height:200px; transition-delay:.15s; }
.dk-wood-ribbons-hint{
  margin-top:14px; text-align:center; font-size:10px; font-family:var(--font-sans,sans-serif);
  text-transform:uppercase; letter-spacing:.15em; color:#6B584799;
}

@media (max-width:768px){
  .dk-wood-ribbons{
    width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
  }
  .dk-wood-ribbons-row{ flex-direction:column; height:auto; border-radius:0; }
  .dk-wood-ribbon{
    clip-path:polygon(0% calc(0% + 10.52px),4.167% calc(0% + 7.36px),8.333% calc(0% + 3.36px),12.5% calc(0% - 1.02px),16.667% calc(0% - 5.29px),20.833% calc(0% - 8.95px),25% calc(0% - 11.58px),29.167% calc(0% - 12.89px),33.333% calc(0% - 12.72px),37.5% calc(0% - 11.08px),41.667% calc(0% - 8.18px),45.833% calc(0% - 4.34px),50% 0%,54.167% calc(0% + 4.34px),58.333% calc(0% + 8.18px),62.5% calc(0% + 11.08px),66.667% calc(0% + 12.72px),70.833% calc(0% + 12.89px),75% calc(0% + 11.58px),79.167% calc(0% + 8.95px),83.333% calc(0% + 5.29px),87.5% calc(0% + 1.02px),91.667% calc(0% - 3.36px),95.833% calc(0% - 7.36px),100% calc(0% - 10.52px),100% calc(100% - 10.52px),95.833% calc(100% - 7.36px),91.667% calc(100% - 3.36px),87.5% calc(100% + 1.02px),83.333% calc(100% + 5.29px),79.167% calc(100% + 8.95px),75% calc(100% + 11.58px),70.833% calc(100% + 12.89px),66.667% calc(100% + 12.72px),62.5% calc(100% + 11.08px),58.333% calc(100% + 8.18px),54.167% calc(100% + 4.34px),50% 100%,45.833% calc(100% - 4.34px),41.667% calc(100% - 8.18px),37.5% calc(100% - 11.08px),33.333% calc(100% - 12.72px),29.167% calc(100% - 12.89px),25% calc(100% - 11.58px),20.833% calc(100% - 8.95px),16.667% calc(100% - 5.29px),12.5% calc(100% - 1.02px),8.333% calc(100% + 3.36px),4.167% calc(100% + 7.36px),0% calc(100% + 10.52px));
    margin-left:0; margin-top:-16px; min-height:58px;
    align-items:flex-start;
  }
  .dk-wood-ribbon:first-child{
    margin-top:0;
    clip-path:polygon(0% 0%,4.167% 0%,8.333% 0%,12.5% 0%,16.667% 0%,20.833% 0%,25% 0%,29.167% 0%,33.333% 0%,37.5% 0%,41.667% 0%,45.833% 0%,50% 0%,54.167% 0%,58.333% 0%,62.5% 0%,66.667% 0%,70.833% 0%,75% 0%,79.167% 0%,83.333% 0%,87.5% 0%,91.667% 0%,95.833% 0%,100% 0%,100% calc(100% - 10.52px),95.833% calc(100% - 7.36px),91.667% calc(100% - 3.36px),87.5% calc(100% + 1.02px),83.333% calc(100% + 5.29px),79.167% calc(100% + 8.95px),75% calc(100% + 11.58px),70.833% calc(100% + 12.89px),66.667% calc(100% + 12.72px),62.5% calc(100% + 11.08px),58.333% calc(100% + 8.18px),54.167% calc(100% + 4.34px),50% 100%,45.833% calc(100% - 4.34px),41.667% calc(100% - 8.18px),37.5% calc(100% - 11.08px),33.333% calc(100% - 12.72px),29.167% calc(100% - 12.89px),25% calc(100% - 11.58px),20.833% calc(100% - 8.95px),16.667% calc(100% - 5.29px),12.5% calc(100% - 1.02px),8.333% calc(100% + 3.36px),4.167% calc(100% + 7.36px),0% calc(100% + 10.52px));
  }
  .dk-wood-ribbon:last-child{
    clip-path:polygon(0% calc(0% + 10.52px),4.167% calc(0% + 7.36px),8.333% calc(0% + 3.36px),12.5% calc(0% - 1.02px),16.667% calc(0% - 5.29px),20.833% calc(0% - 8.95px),25% calc(0% - 11.58px),29.167% calc(0% - 12.89px),33.333% calc(0% - 12.72px),37.5% calc(0% - 11.08px),41.667% calc(0% - 8.18px),45.833% calc(0% - 4.34px),50% 0%,54.167% calc(0% + 4.34px),58.333% calc(0% + 8.18px),62.5% calc(0% + 11.08px),66.667% calc(0% + 12.72px),70.833% calc(0% + 12.89px),75% calc(0% + 11.58px),79.167% calc(0% + 8.95px),83.333% calc(0% + 5.29px),87.5% calc(0% + 1.02px),91.667% calc(0% - 3.36px),95.833% calc(0% - 7.36px),100% calc(0% - 10.52px),100% 100%,95.833% 100%,91.667% 100%,87.5% 100%,83.333% 100%,79.167% 100%,75% 100%,70.833% 100%,66.667% 100%,62.5% 100%,58.333% 100%,54.167% 100%,50% 100%,45.833% 100%,41.667% 100%,37.5% 100%,33.333% 100%,29.167% 100%,25% 100%,20.833% 100%,16.667% 100%,12.5% 100%,8.333% 100%,4.167% 100%,0% 100%);
  }
  .dk-wood-ribbon.is-active{ flex-grow:5; min-height:280px; }
  .dk-wood-ribbon-content{ padding:14px 24px 10px; }
  .dk-wood-ribbon:first-child .dk-wood-ribbon-content{ padding-top:22px; }
  .dk-wood-ribbon.is-active .dk-wood-ribbon-content{ padding:22px 28px 20px; max-width:none; }
  .dk-wood-ribbon.is-active:first-child .dk-wood-ribbon-content{ padding-top:30px; }
  .dk-wood-ribbon-label{
    writing-mode:horizontal-tb; font-size:.8rem; white-space:normal;
  }
  .dk-wood-ribbon.is-active .dk-wood-ribbon-label{ font-size:1.25rem; margin-bottom:8px; }
  .dk-wood-ribbon-icon{ margin-bottom:4px; }
  .dk-wood-ribbon.is-active .dk-wood-ribbon-icon{ margin-bottom:8px; }
  .dk-wood-ribbon-desc{ max-width:none; }
  .dk-wood-ribbon.is-active .dk-wood-ribbon-desc{ max-height:220px; }
}

/* ============================================================
   Pod-stranice usluga — hero visina smanjena za 40%
   (85vh -> 51vh, min 600px -> 360px). Cilja samo /usluge/<...>
   hero koji koristi klase h-[85vh] min-h-[600px].
   ============================================================ */
section.h-\[85vh\].min-h-\[600px\]{
  height:51vh !important;
  min-height:360px !important;
}