/* generisano iz src/styles.css (node build.js) */
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/jost-latin-300-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/jost-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/jost-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/jost-latin-ext-300-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/jost-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/jost-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Spectral';font-style:italic;font-weight:200;font-display:swap;src:url(../fonts/spectral-latin-200-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Spectral';font-style:normal;font-weight:200;font-display:swap;src:url(../fonts/spectral-latin-200-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Spectral';font-style:italic;font-weight:300;font-display:swap;src:url(../fonts/spectral-latin-300-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Spectral';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/spectral-latin-300-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Spectral';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/spectral-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Spectral';font-style:italic;font-weight:200;font-display:swap;src:url(../fonts/spectral-latin-ext-200-italic.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Spectral';font-style:normal;font-weight:200;font-display:swap;src:url(../fonts/spectral-latin-ext-200-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Spectral';font-style:italic;font-weight:300;font-display:swap;src:url(../fonts/spectral-latin-ext-300-italic.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Spectral';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/spectral-latin-ext-300-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Spectral';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/spectral-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* ==========================================================================
   Fuga design system
   Hairlines behave like grout joints, layout is laid like large-format slabs.
   ========================================================================== */
:root{
  --warm-white:#FAF8F4; --ivory:#F3EFE7; --sand:#E4DAC8; --beige:#D9CDB8;
  --warm-gray:#8C857A; --graphite:#2B2A28; --black:#141312; --bronze:#8A6F4D;

  --bg:var(--warm-white); --bg-2:var(--ivory); --bg-3:var(--sand);
  --ink:var(--graphite); --ink-2:#5F5B54; --ink-3:var(--warm-gray);
  --line:rgba(43,42,40,.16); --line-soft:rgba(43,42,40,.08);
  --accent:var(--bronze); --field:#fff; --danger:#9A3B2E;
  --inv-bg:var(--graphite); --inv-ink:var(--ivory); --inv-line:rgba(243,239,231,.18);

  --serif:'Spectral','Iowan Old Style','Palatino Linotype','Book Antiqua',Georgia,serif;
  --sans:'Jost','Avenir Next','Century Gothic','Segoe UI',system-ui,sans-serif;
  --ease:cubic-bezier(.22,.7,.12,1); --ease-io:cubic-bezier(.76,0,.24,1);
  --pad:clamp(20px,4.2vw,72px); --gap:clamp(12px,2vw,32px); --hdr:76px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#1B1A19; --bg-2:#232220; --bg-3:#2E2C29; --ink:#F3EFE7; --ink-2:#C9C2B5; --ink-3:#9A9388;
    --line:rgba(243,239,231,.18); --line-soft:rgba(243,239,231,.09); --accent:#C2A47A; --field:#232220; --danger:#E08B7C;
    --inv-bg:#0F0F0E; --inv-ink:#F3EFE7;
  }
}
:root[data-theme="dark"]{
  --bg:#1B1A19; --bg-2:#232220; --bg-3:#2E2C29; --ink:#F3EFE7; --ink-2:#C9C2B5; --ink-3:#9A9388;
  --line:rgba(243,239,231,.18); --line-soft:rgba(243,239,231,.09); --accent:#C2A47A; --field:#232220; --danger:#E08B7C;
  --inv-bg:#0F0F0E; --inv-ink:#F3EFE7;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-weight:300;font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
h1,h2,h3,h4,p,figure,ul,ol,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer;border-radius:0}
:focus-visible{outline:1px solid var(--ink);outline-offset:4px}
::selection{background:var(--sand);color:var(--graphite)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:16px;top:-80px;z-index:200;background:var(--ink);color:var(--bg);padding:12px 18px;font-size:13px;letter-spacing:.08em}
.skip:focus{top:16px}

/* ---------- layout ---------- */
.wrap{padding-inline:var(--pad);max-width:1840px;margin-inline:auto;position:relative}
.g12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.sec{padding-block:clamp(72px,9vw,150px);position:relative}
.sec--sm{padding-block:clamp(48px,6vw,96px)}
/* dvije uzastopne sekcije iste pozadine dijele jedan razmak, ne dva */
.sec:not(.sec--ivory):not(.sec--inv)+.sec:not(.sec--ivory):not(.sec--inv){padding-top:0}
.sec--ivory{background:var(--bg-2)}
.sec--inv{background:var(--inv-bg);color:var(--inv-ink);--bg:var(--inv-bg);--ink:var(--inv-ink);--ink-2:rgba(243,239,231,.72);--ink-3:rgba(243,239,231,.5);--line:var(--inv-line);--line-soft:rgba(243,239,231,.1)}
.fuga{height:1px;background:var(--line);border:0;margin:0;transform-origin:left;}
.rv-line{transform:scaleX(0);transition:transform 1.4s var(--ease-io)}
.rv-line.in{transform:scaleX(1)}

/* grout joints running through the page */
.joints{position:fixed;inset:0;z-index:0;pointer-events:none;display:none}
.joints i{position:absolute;top:0;bottom:0;width:1px;background:var(--line-soft)}
@media(min-width:1100px){.joints{display:block}
  .joints i:nth-child(1){left:var(--pad)} .joints i:nth-child(2){left:calc(var(--pad) + (100% - 2*var(--pad))/3)}
  .joints i:nth-child(3){left:calc(var(--pad) + (100% - 2*var(--pad))*2/3)} .joints i:nth-child(4){right:var(--pad)}}
main,.ftr{position:relative;z-index:1}

/* ---------- type ---------- */
.d1,.d2,.d3,.d4{font-family:var(--serif);font-weight:200;letter-spacing:-.022em;line-height:1;text-wrap:balance}
.d1{font-size:clamp(46px,8.4vw,156px);line-height:.96}
.d2{font-size:clamp(38px,5.9vw,104px);line-height:1}
.d3{font-size:clamp(30px,3.7vw,60px);line-height:1.06;font-weight:300;letter-spacing:-.015em}
.d4{font-size:clamp(23px,2.1vw,32px);line-height:1.2;font-weight:300;letter-spacing:-.01em}
.d1 em,.d2 em,.d3 em{font-style:italic;font-weight:200}
.lead{font-family:var(--serif);font-weight:300;font-size:clamp(20px,1.75vw,27px);line-height:1.42;letter-spacing:-.005em}
.body{max-width:58ch;color:var(--ink-2)}
.body p+p{margin-top:1.1em}
.cap{font-size:11.5px;font-weight:500;letter-spacing:.17em;text-transform:uppercase}
.meta{font-size:13.5px;color:var(--ink-3);letter-spacing:.02em}
.num{font-family:var(--sans);font-weight:300;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.ln{display:block;overflow:hidden;padding-bottom:.09em;margin-bottom:-.09em}
.ln>span{display:block;transform:translateY(108%);transition:transform 1.25s var(--ease)}
.in .ln>span,.ln.in>span{transform:none}
.ln:nth-child(2)>span{transition-delay:.09s}.ln:nth-child(3)>span{transition-delay:.18s}.ln:nth-child(4)>span{transition-delay:.27s}

/* ---------- links & buttons ---------- */
.lnk{position:relative;display:inline-block;padding-bottom:7px;font-size:12px;font-weight:500;letter-spacing:.17em;text-transform:uppercase}
.lnk::after,.lnk::before{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor}
.lnk::before{opacity:.25}
.lnk::after{transform:scaleX(.28);transform-origin:left;transition:transform .7s var(--ease)}
.lnk:hover::after,.lnk:focus-visible::after{transform:scaleX(1)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 30px;border:1px solid var(--ink);
  font-size:12px;font-weight:500;letter-spacing:.17em;text-transform:uppercase;position:relative;overflow:hidden;isolation:isolate;
  transition:color .5s var(--ease),border-color .5s var(--ease);white-space:nowrap;cursor:pointer}
.btn::before{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleY(0);transform-origin:bottom;transition:transform .55s var(--ease-io);z-index:-1}
.btn:hover,.btn:focus-visible{color:var(--bg)}
.btn:hover::before,.btn:focus-visible::before{transform:scaleY(1)}
.btn--solid{background:var(--ink);color:var(--bg)}
.btn--solid::before{background:var(--bg)}
.btn--solid:hover,.btn--solid:focus-visible{color:var(--ink)}
.btn--sm{min-height:44px;padding:0 22px;font-size:11px}
.btn--block{width:100%}
.btns{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center}

/* ---------- image placeholders ---------- */
.ph{position:relative;overflow:hidden;background:var(--bg-3);display:block}
.ph-i{position:absolute;left:0;top:calc(-1*var(--ov,7%));width:100%;height:calc(100% + 2*var(--ov,7%));max-width:none;display:block;border:0;object-fit:cover;object-position:center;will-change:transform;color:transparent;font-size:0}
.ph--flat .ph-i{--ov:0%}
.r-45{aspect-ratio:4/5}.r-34{aspect-ratio:3/4}.r-11{aspect-ratio:1}.r-32{aspect-ratio:3/2}.r-169{aspect-ratio:16/9}.r-219{aspect-ratio:21/9}.r-23{aspect-ratio:2/3}
/* maska je na slici, ne na posmatranom elementu: element odsječen vlastitim clip-path-om IntersectionObserver nikad ne prijavi kao vidljiv */
.rv-img{background:transparent}
.rv-img .ph-i{clip-path:inset(0 0 100% 0);transform:scale(1.16);transition:clip-path 1.5s var(--ease-io),transform 2.2s var(--ease)}
.rv-img.in .ph-i{clip-path:inset(0 0 0 0);transform:scale(1)}
.rv{opacity:0;transform:translateY(26px);transition:opacity 1.1s var(--ease),transform 1.2s var(--ease)}
.rv.in{opacity:1;transform:none}
.d-1{transition-delay:.1s}.d-2{transition-delay:.2s}.d-3{transition-delay:.3s}.d-4{transition-delay:.4s}
a .ph .ph-i{transition:clip-path 1.5s var(--ease-io),transform 1.8s var(--ease)}
a:hover .ph.in .ph-i,a:focus-visible .ph.in .ph-i{transform:scale(1.045)}
.figcap{display:flex;justify-content:space-between;gap:16px;margin-top:14px;font-size:13px;color:var(--ink-3)}

.demo-note{display:inline-flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.08em;color:var(--ink-3);border:1px dashed var(--line);padding:5px 10px;line-height:1.3}
.demo-note::before{content:"";width:5px;height:5px;background:var(--accent);display:inline-block;flex:none}
[data-demo="off"] .demo-note{display:none}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:60;height:var(--hdr);display:flex;align-items:center;color:var(--ink);
  transition:background-color .6s var(--ease),color .6s var(--ease),transform .6s var(--ease),border-color .6s}
.hdr::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);opacity:0;transition:opacity .6s}
.hdr.is-solid{background:var(--bg)}
.hdr.is-solid::after{opacity:1}
.hdr.is-hidden{transform:translateY(-100%)}
.hdr.on-dark:not(.is-solid){color:#FAF8F4}
.hdr.on-light:not(.is-solid){color:#2B2A28}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%}
.logo{display:inline-flex;align-items:baseline;gap:10px;font-weight:500;letter-spacing:.3em;font-size:12.5px;white-space:nowrap}
.logo b{font-family:var(--serif);font-weight:300;font-style:italic;font-size:27px;letter-spacing:-.02em;line-height:1}
.logo i{width:1px;height:20px;background:currentColor;opacity:.45;align-self:center}
.nav{display:none;gap:clamp(14px,1.7vw,30px)}
.nav a{white-space:nowrap;font-size:11.5px;font-weight:500;letter-spacing:.16em;position:relative;padding:8px 0;opacity:.82;transition:opacity .4s}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease)}
.nav a:hover,.nav a[aria-current="page"]{opacity:1}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.hdr__cta{display:none}
.hdr .btn{border-color:currentColor;min-height:42px;padding:0 20px;font-size:11px}
.hdr.on-dark:not(.is-solid) .btn::before{background:#FAF8F4}
.hdr.on-dark:not(.is-solid) .btn:hover{color:#2B2A28}
.hdr__m{display:flex;align-items:center;gap:18px}
.hdr__upit{font-size:11px;font-weight:500;letter-spacing:.16em;border-bottom:1px solid currentColor;padding-bottom:3px}
.burger{width:44px;height:44px;display:grid;place-items:center;margin-right:-10px}
.burger span{display:block;width:26px;height:1px;background:currentColor;position:relative;transition:background .3s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:26px;height:1px;background:currentColor;transition:transform .5s var(--ease)}
.burger span::before{top:-7px}.burger span::after{top:7px}
.menu-open .burger span{background:transparent}
.menu-open .burger span::before{transform:translateY(7px) rotate(45deg)}
.menu-open .burger span::after{transform:translateY(-7px) rotate(-45deg)}
@media(min-width:1280px){.nav{display:flex}.hdr__cta{display:inline-flex}.hdr__m{display:none}}

.menu{position:fixed;inset:0;z-index:55;background:var(--bg);color:var(--ink);padding:calc(var(--hdr) + 12px) var(--pad) 28px;display:flex;flex-direction:column;
  clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease-io);visibility:hidden;overflow-y:auto}
.menu-open .menu{clip-path:inset(0);visibility:visible}
.menu-open .hdr{color:var(--ink)!important;background:transparent}
.menu ul{border-top:1px solid var(--line)}
.menu li{border-bottom:1px solid var(--line);overflow:hidden}
.menu li a{display:flex;align-items:baseline;gap:16px;padding:13px 0;font-family:var(--serif);font-weight:200;font-size:clamp(28px,7.6vw,44px);letter-spacing:-.02em;line-height:1.1;
  transform:translateY(105%);transition:transform .9s var(--ease)}
.menu li a .num{font-size:11px;color:var(--ink-3);width:22px}
.menu-open .menu li a{transform:none}
.menu li:nth-child(n) a{transition-delay:calc(.12s + var(--i,0)*.045s)}
.menu__ft{margin-top:auto;padding-top:28px;display:grid;gap:18px}
.menu__ft .meta a{border-bottom:1px solid var(--line)}

.mcta{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:repeat(3,1fr);background:var(--ink);color:var(--bg);
  transform:translateY(100%);transition:transform .7s var(--ease);padding-bottom:env(safe-area-inset-bottom)}
.mcta.is-on{transform:none}
.mcta a{display:flex;align-items:center;justify-content:center;height:54px;font-size:11px;font-weight:500;letter-spacing:.18em}
.mcta a+a{border-left:1px solid rgba(250,248,244,.22)}
@media(min-width:900px){.mcta{display:none}}
@media(max-width:899px){body{padding-bottom:54px}}

/* ---------- page transition: slabs ---------- */
.pt{position:fixed;inset:0;z-index:90;display:grid;grid-template-columns:repeat(4,1fr);pointer-events:none}
.pt i{background:var(--bg-2);transform:scaleY(0);transform-origin:bottom;transition:transform .62s var(--ease-io);border-right:1px solid var(--line)}
.pt i:nth-child(2){transition-delay:.06s}.pt i:nth-child(3){transition-delay:.12s}.pt i:nth-child(4){transition-delay:.18s;border:0}
.pt.is-in i{transform:scaleY(1)}
.pt.is-out i{transform:scaleY(0);transform-origin:top}

/* ---------- hero ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:600px;overflow:hidden;color:#2B2A28;background:var(--bg-3)}
.hero.tone-dark{color:#FAF8F4}
.hero__slide{position:absolute;inset:0;opacity:0;transition:opacity 2.2s var(--ease);}
.hero__slide.is-on{opacity:1}
.hero__slide .ph-i{--ov:0%;transform:scale(1.02)}
.hero__slide.is-on .ph-i{animation:kb 14s linear forwards}
@keyframes kb{from{transform:scale(1.02) translate3d(0,0,0)}to{transform:scale(1.11) translate3d(-1.2%,-.8%,0)}}
.hero__scrim{position:absolute;inset:0;pointer-events:none;transition:opacity 1.6s var(--ease);
  background:linear-gradient(180deg,rgba(250,248,244,.34) 0,rgba(250,248,244,0) 22%,rgba(250,248,244,0) 46%,rgba(250,248,244,.62) 100%)}
.hero__scrim--d{opacity:0;background:linear-gradient(180deg,rgba(20,19,18,.42) 0,rgba(20,19,18,0) 24%,rgba(20,19,18,.06) 40%,rgba(20,19,18,.5) 66%,rgba(20,19,18,.74) 100%)}
.hero.tone-dark .hero__scrim--d{opacity:1}.hero.tone-dark .hero__scrim--l{opacity:0}
.hero__slabs{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);z-index:3;pointer-events:none}
.hero__slabs i{background:var(--bg);border-right:1px solid var(--line);transform:translateY(0);transition:transform 1.5s var(--ease-io)}
.hero__slabs i:nth-child(2){transition-delay:.1s}.hero__slabs i:nth-child(3){transition-delay:.2s}.hero__slabs i:nth-child(4){transition-delay:.3s}
.hero.is-ready .hero__slabs i{transform:translateY(-101%)}
.hero__body{position:absolute;left:0;right:0;bottom:0;z-index:4;padding-bottom:clamp(34px,5.4vw,80px)}
.hero__title{transition:color 1.4s var(--ease);max-width:12.5em}
/* donji red hero sekcije je flex: tekst, dugmad i indikator slajdova su u istom toku, pa se nikad ne mogu preklopiti */
.hero__row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:24px clamp(28px,4vw,72px);margin-top:clamp(22px,2.4vw,34px)}
.hero__sub{flex:1 1 100%;max-width:30ch}
.hero__cta{flex:0 1 auto}
.hero__idx{flex:1 0 100%;display:flex;align-items:center;gap:14px;font-size:12px;padding-top:14px;border-top:1px solid color-mix(in srgb,currentColor 28%,transparent)}
.hero__idx [data-go]{width:34px;height:32px;position:relative}
.hero__idx [data-go]::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:currentColor;opacity:.3;transition:opacity .4s}
.hero__idx [data-go][aria-current="true"]::after{opacity:1}
.hero__idx [data-hero-pause]{margin-left:auto;font-size:10.5px;font-weight:500;letter-spacing:.16em;padding:9px 0 6px;border-bottom:1px solid currentColor}
@media(min-width:900px){.hero__sub{flex:0 1 30ch}}
@media(min-width:1280px){.hero__idx{flex:0 0 auto;margin-left:auto;padding-top:0;border-top:0}.hero__idx [data-hero-pause]{margin-left:8px}}
.hero .btn{border-color:currentColor}
.hero .btn--solid{background:#2B2A28;color:#FAF8F4;border-color:#2B2A28}
.hero .btn--solid::before{background:#FAF8F4}.hero .btn--solid:hover{color:#2B2A28}
.hero.tone-dark .btn--solid{background:#FAF8F4;color:#2B2A28;border-color:#FAF8F4}
.hero.tone-dark .btn--solid::before{background:#2B2A28}.hero.tone-dark .btn--solid:hover{color:#FAF8F4}
.hero.tone-dark .btn:not(.btn--solid)::before{background:#FAF8F4}.hero.tone-dark .btn:not(.btn--solid):hover{color:#2B2A28}
/* interior page hero */
.phero{position:relative;min-height:min(92svh,980px);display:flex;align-items:flex-end;color:#FAF8F4;overflow:hidden;background:var(--graphite)}
.phero .ph{position:absolute;inset:0}
.phero .ph-i{--ov:6%}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,19,18,.38) 0,rgba(20,19,18,.04) 30%,rgba(20,19,18,.1) 50%,rgba(20,19,18,.66) 100%)}
.phero__in{position:relative;z-index:2;width:100%;padding-bottom:clamp(36px,5vw,76px);padding-top:calc(var(--hdr) + 60px)}
.phero__in .lead{max-width:34ch;margin-top:26px;color:rgba(250,248,244,.9)}
.crumbs{display:flex;flex-wrap:wrap;gap:8px 12px;font-size:12px;letter-spacing:.06em;margin-bottom:26px;opacity:.85}
.crumbs li+li::before{content:"/";margin-right:12px;opacity:.5}
.crumbs a:hover{text-decoration:underline;text-underline-offset:4px}
/* text-only page head */
.thead{padding-top:calc(var(--hdr) + clamp(56px,9vw,140px));padding-bottom:clamp(40px,6vw,90px)}
.thead .crumbs{color:var(--ink-3)}
.thead .lead{margin-top:30px;max-width:36ch;color:var(--ink-2)}

/* ---------- home: editorial intro ---------- */
.intro .g12{row-gap:clamp(30px,4vw,56px);align-items:end}
.intro__t{grid-column:1/-1}
.intro__s{grid-column:1/-1;display:grid;gap:22px;align-content:end}
.intro__img{grid-column:1/-1}
/* slika i tekst čine jedan blok: tekst je poravnat sa donjom ivicom slike, bez praznog hoda */
@media(min-width:760px){.intro__img{grid-column:1/8}.intro__s{grid-column:8/13;padding-left:var(--gap)}}
@media(min-width:1200px){.intro__t{grid-column:1/10}.intro__s{grid-column:9/13;padding-left:0}}

/* ---------- collections index ---------- */
.cidx{position:relative}
.cidx__hd{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(30px,4vw,60px)}
.cidx__list{border-top:1px solid var(--line)}
.cidx__list li{border-bottom:1px solid var(--line)}
.cidx__a{display:grid;grid-template-columns:44px 1fr auto;align-items:baseline;gap:12px;padding:clamp(14px,1.6vw,26px) 0;position:relative;transition:padding-left .8s var(--ease),color .5s}
.cidx__a .num{font-size:12px;color:var(--ink-3)}
.cidx__n{font-family:var(--serif);font-weight:200;font-size:clamp(38px,6.6vw,118px);line-height:1;letter-spacing:-.025em}
.cidx__m{font-size:13px;color:var(--ink-3);text-align:right;display:none}
.cidx__mob{margin:4px 0 22px}
@media(min-width:1024px){
  .cidx__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
  .cidx__list{grid-column:1/9}.cidx__m{display:block}.cidx__mob{display:none}
  .cidx__view{grid-column:9/13;position:sticky;top:calc(var(--hdr) + 28px);align-self:start;aspect-ratio:4/5;overflow:hidden;background:var(--bg-3)}
  .cidx__view .ph{position:absolute;inset:0;opacity:0;transition:opacity .9s var(--ease)}
  .cidx__view .ph .ph-i{transform:scale(1.1);transition:transform 2.4s var(--ease)}
  .cidx__view .ph.is-on{opacity:1}.cidx__view .ph.is-on .ph-i{transform:scale(1)}
  .cidx__list:hover .cidx__a{color:var(--ink-3)}
  .cidx__list .cidx__a:hover,.cidx__list .cidx__a:focus-visible{color:var(--ink);padding-left:22px}
}
@media(max-width:1023px){.cidx__view{display:none}}

/* ---------- split / editorial blocks ---------- */
.split .g12{row-gap:40px;align-items:center}
.split__a{grid-column:1/-1}.split__b{grid-column:1/-1}
@media(min-width:900px){.split__a{grid-column:1/8}.split__b{grid-column:9/13}.split--r .split__a{grid-column:6/13;order:2}.split--r .split__b{grid-column:1/5;order:1}}
.stack>*+*{margin-top:26px}
.duo{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:clamp(28px,4vw,48px);align-items:start}
.duo__l{grid-column:1/-1}.duo__s{grid-column:3/-1}
.duo__t{margin-top:clamp(24px,3vw,44px);max-width:44ch}
.duo--txt .duo__s{grid-column:5/-1}
@media(min-width:700px){.duo__l{grid-column:1/8}.duo__s,.duo--txt .duo__s{grid-column:9/13;margin-top:18%}
  /* tekst ispod velike slike (uvučen dvije kolone), mala slika poravnata sa dnom bloka: nema mrtvog prostora */
  .duo--txt .duo__s{margin-top:0;align-self:end}.duo--txt .duo__t{margin-left:calc((100% + var(--gap))/7*2)}}

/* ---------- horizontal gallery ---------- */
.hgal{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;cursor:grab;-webkit-overflow-scrolling:touch}
.hgal::-webkit-scrollbar{display:none}
.hgal.is-drag{cursor:grabbing}.hgal.is-drag a{pointer-events:none}
.hgal__track{display:flex;gap:var(--gap);padding-inline:var(--pad);width:max-content;align-items:flex-end}
.hgal__it{flex:none;width:clamp(240px,27vw,460px)}
.hgal__it:nth-child(3n+2){width:clamp(280px,36vw,640px)}
.hgal__it:nth-child(3n+2) .ph{aspect-ratio:3/2}
.hgal__it .ph{aspect-ratio:4/5}
.hgal__it h3{margin-top:18px;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.hgal__bar{height:1px;background:var(--line);margin:clamp(30px,4vw,56px) var(--pad) 0;position:relative}
.hgal__bar i{position:absolute;left:0;top:-1px;height:3px;width:20%;background:var(--ink);transform-origin:left}

/* ---------- before / after ---------- */
.ba{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-3);--pos:52%;touch-action:pan-y;user-select:none}
.ba .ph{position:absolute;inset:0}.ba .ph-i{--ov:0%}
.ba__top{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.ba__h{position:absolute;top:0;bottom:0;left:var(--pos);width:1px;background:#FAF8F4;z-index:3;pointer-events:none}
.ba__h::after{content:"";position:absolute;top:50%;left:50%;width:54px;height:54px;border:1px solid #FAF8F4;transform:translate(-50%,-50%);background:rgba(20,19,18,.28);backdrop-filter:none}
.ba__h::before{content:"";position:absolute;top:50%;left:50%;width:18px;height:1px;background:#FAF8F4;transform:translate(-50%,-50%);z-index:1;box-shadow:0 0 0 0 transparent}
.ba__l{position:absolute;bottom:18px;z-index:2;color:#FAF8F4;font-size:11px;font-weight:500;letter-spacing:.18em;background:rgba(20,19,18,.45);padding:6px 10px}
.ba__l--a{left:18px}.ba__l--b{right:18px}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:4;margin:0}
.ba:focus-within .ba__h::after{outline:1px solid #FAF8F4;outline-offset:4px}

/* ---------- brands / catalogs / lists ---------- */
.lw{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.lw>*{border-right:1px solid var(--line);border-bottom:1px solid var(--line);aspect-ratio:3/2;display:grid;place-items:center;text-align:center;padding:18px;position:relative;transition:background .6s}
.lw>a:hover{background:var(--bg-2)}
.lw .wm{font-family:var(--serif);font-weight:200;font-style:italic;font-size:clamp(20px,2vw,30px);color:var(--ink-3);letter-spacing:-.01em}
.lw .meta{position:absolute;left:14px;bottom:10px;font-size:11px}
@media(min-width:760px){.lw{grid-template-columns:repeat(4,1fr)}}
.rows{border-top:1px solid var(--line)}
.rows>li,.rows>div{border-bottom:1px solid var(--line)}
.row{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px 20px;padding:clamp(20px,2.4vw,34px) 0;align-items:baseline}
/* broj | naslov, a tekst ISPOD naslova u istoj koloni (ranije je padao u kolonu broja, široku 44px) */
.row>.num{grid-row:1/span 2}.row>p{grid-column:2}
.row .num{font-size:12px;color:var(--ink-3)}
.row p{color:var(--ink-2);max-width:52ch}
@media(min-width:1200px){.row{grid-template-columns:70px minmax(0,5fr) minmax(0,6fr);gap:12px 20px}.row>.num{grid-row:auto}.row>p{grid-column:auto}}
.spec{border-top:1px solid var(--line)}
.spec div{display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:16px;padding:15px 0;border-bottom:1px solid var(--line);font-size:15.5px}
.spec dt{color:var(--ink-3);font-size:11.5px;font-weight:500;letter-spacing:.15em;text-transform:uppercase;padding-top:3px}

/* ---------- cards grids ---------- */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,64px) var(--gap)}
@media(min-width:900px){.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:559px){.grid--1m{grid-template-columns:1fr}}
.card h3{margin-top:16px;font-family:var(--serif);font-weight:300;font-size:clamp(19px,1.5vw,24px);letter-spacing:-.01em;line-height:1.2}
.card .meta{margin-top:4px}
.mosaic{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(36px,6vw,110px) var(--gap)}
.mosaic>*{grid-column:1/-1}
@media(min-width:900px){
  .mosaic>:nth-child(4n+1){grid-column:1/8}.mosaic>:nth-child(4n+2){grid-column:9/13;margin-top:32%}
  .mosaic>:nth-child(4n+3){grid-column:2/6;margin-top:-6%}.mosaic>:nth-child(4n+4){grid-column:7/13}
}
.mosaic h3{margin-top:18px;display:flex;justify-content:space-between;gap:16px;align-items:baseline}

/* ---------- kupatila moods ---------- */
.moods{display:grid;gap:0}
.mood{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:28px;padding-block:clamp(48px,7vw,120px);border-top:1px solid var(--line);align-items:center}
.mood__img{grid-column:1/-1}.mood__txt{grid-column:1/-1}
.mood__n{font-size:12px;color:var(--ink-3);margin-bottom:18px;display:block}
.tags{display:flex;flex-wrap:wrap;gap:8px}.mood ul.tags{margin-top:24px}
.tags li{border:1px solid var(--line);padding:6px 12px;font-size:12.5px;letter-spacing:.04em;color:var(--ink-2)}
@media(min-width:900px){.mood__img{grid-column:1/8}.mood__txt{grid-column:9/13}.mood:nth-child(even) .mood__img{grid-column:6/13;order:2}.mood:nth-child(even) .mood__txt{grid-column:1/5}}
.sidx{display:none}
@media(min-width:1280px){.sidx{display:grid;gap:10px;position:fixed;left:calc(var(--pad) - 44px);top:50%;transform:translateY(-50%);z-index:20;font-size:11px;color:var(--ink-3);opacity:0;transition:opacity .6s}
  .sidx.is-on{opacity:1}.sidx a{display:block;padding:3px 0;transition:color .4s}.sidx a.is-on{color:var(--ink)}}

/* ---------- filters ---------- */
.flt{display:grid;gap:22px;padding-block:28px;border-block:1px solid var(--line)}
.flt__g{display:grid;gap:12px;align-items:start}
@media(min-width:900px){.flt__g{grid-template-columns:130px 1fr;align-items:center}}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1px solid var(--line);padding:9px 16px;font-size:13px;letter-spacing:.04em;transition:background .4s,color .4s,border-color .4s;min-height:40px}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.flt__ft{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:26px 0 clamp(30px,4vw,56px)}
.empty{padding:70px 0;text-align:left;border-bottom:1px solid var(--line)}

/* ---------- calculator & form ---------- */
.calc{border:1px solid var(--line);background:var(--bg);display:grid}
.calc__in{padding:clamp(24px,3vw,44px);display:grid;gap:22px}
.calc__out{padding:clamp(24px,3vw,44px);background:var(--bg-2);display:grid;gap:22px;align-content:start;border-top:1px solid var(--line)}
@media(min-width:900px){.calc{grid-template-columns:1.1fr 1fr}.calc__out{border-top:0;border-left:1px solid var(--line)}}
.calc__row{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:end}
.calc__x{font-family:var(--serif);font-size:26px;font-weight:200;padding-bottom:8px;color:var(--ink-3)}
.calc__big{font-family:var(--serif);font-weight:200;font-size:clamp(40px,4.6vw,72px);line-height:1;letter-spacing:-.02em}
.calc__big small{font-size:.38em;letter-spacing:0;margin-left:6px;color:var(--ink-3)}
.calc__res{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:end}
.fld select{text-overflow:ellipsis}
.fld{display:grid;gap:8px;position:relative}
.fld label,.fld .lab{font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2)}
.fld input,.fld select,.fld textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);padding:10px 0 12px;font-size:17px;font-weight:300;border-radius:0;outline:none;transition:border-color .4s;appearance:none;-webkit-appearance:none}
.fld select{background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 11px) 55%,calc(100% - 6px) 55%;background-size:5px 5px;background-repeat:no-repeat;padding-right:26px}
.fld select option{color:#2B2A28;background:#fff}
.fld textarea{min-height:120px;resize:vertical;line-height:1.5}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-bottom-color:var(--ink)}
.fld input:focus-visible,.fld select:focus-visible,.fld textarea:focus-visible{outline:none;box-shadow:0 1px 0 0 var(--ink)}
.fld.is-err input,.fld.is-err select,.fld.is-err textarea{border-bottom-color:var(--danger)}
.fld .err{font-size:12.5px;color:var(--danger);min-height:0}
.form{display:grid;gap:30px var(--gap);grid-template-columns:1fr}
@media(min-width:760px){.form{grid-template-columns:1fr 1fr}.form .full{grid-column:1/-1}}
.chk{display:flex;gap:14px;align-items:flex-start;cursor:pointer;font-size:15px;color:var(--ink-2);line-height:1.45}
.chk input{appearance:none;-webkit-appearance:none;width:20px;height:20px;border:1px solid var(--ink);flex:none;margin:1px 0 0;display:grid;place-items:center;cursor:pointer;background:transparent;border-radius:0}
.chk input::after{content:"";width:10px;height:10px;background:var(--ink);transform:scale(0);transition:transform .3s var(--ease)}
.chk input:checked::after{transform:scale(1)}
.drop{border:1px dashed var(--line);padding:26px;display:grid;gap:8px;justify-items:start;cursor:pointer;transition:border-color .4s,background .4s}
.drop:hover,.drop.is-over{border-color:var(--ink);background:var(--bg-2)}
.thumbs{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.thumbs figure{width:84px;position:relative}
.thumbs img{width:84px;height:84px;object-fit:cover;display:block}
.thumbs button{position:absolute;top:0;right:0;width:24px;height:24px;background:var(--ink);color:var(--bg);font-size:14px;line-height:1}
.done{border:1px solid var(--line);padding:clamp(28px,4vw,60px);background:var(--bg-2)}
.done .spec{margin-top:28px}

/* ---------- guide ---------- */
.guide{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.guide__nav{display:none}
.guide__body{grid-column:1/-1}
@media(min-width:1024px){.guide__nav{display:block;grid-column:1/4;position:sticky;top:calc(var(--hdr) + 32px);align-self:start}
  .guide__body{grid-column:5/12}
  .guide__nav a{display:grid;grid-template-columns:30px 1fr;gap:8px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14.5px;color:var(--ink-3);transition:color .4s}
  .guide__nav a:hover,.guide__nav a.is-on{color:var(--ink)}}
.q{padding-block:clamp(44px,5vw,80px);border-top:1px solid var(--line)}
.q:first-child{border-top:0;padding-top:0}
.q h2{margin:14px 0 26px}
.q .prose{font-family:var(--serif);font-weight:300;font-size:clamp(18px,1.35vw,21px);line-height:1.62;color:var(--ink);max-width:40em}
.q .prose p+p{margin-top:1em}
.q .prose strong{font-weight:400}
.q aside{margin-top:30px;border-left:1px solid var(--ink);padding:4px 0 4px 22px;font-size:15.5px;color:var(--ink-2);max-width:52ch}
.q aside b{display:block;font-size:11px;letter-spacing:.16em;font-weight:500;text-transform:uppercase;color:var(--ink);margin-bottom:8px}

/* ---------- full-bleed CTA ---------- */
.fcta{position:relative;min-height:min(88svh,900px);display:flex;align-items:center;color:#FAF8F4;overflow:hidden;background:var(--graphite)}
.fcta .ph{position:absolute;inset:0}.fcta .ph-i{--ov:10%}
.fcta::after{content:"";position:absolute;inset:0;background:rgba(20,19,18,.5)}
.fcta__in{position:relative;z-index:2;width:100%}
.fcta .btn{border-color:#FAF8F4;color:#FAF8F4}
.fcta .btn::before{background:#FAF8F4}.fcta .btn:hover{color:#2B2A28}
.fcta .lead{opacity:.85;margin:0 0 18px}

/* ---------- map placeholder ---------- */
.map{position:relative;aspect-ratio:16/10;background:var(--bg-2);overflow:hidden;border:1px solid var(--line)}
.map svg{position:absolute;inset:0;width:100%;height:100%}
.map__pin{position:absolute;left:54%;top:46%;transform:translate(-50%,-100%);display:grid;justify-items:center;gap:6px}
.map__pin i{width:1px;height:46px;background:var(--ink)}
.map__pin b{font-weight:500;font-size:11px;letter-spacing:.16em;background:var(--ink);color:var(--bg);padding:7px 12px;white-space:nowrap}
.map__pin::after{content:"";width:9px;height:9px;background:var(--ink);transform:rotate(45deg);margin-top:-10px}
.map .demo-note{position:absolute;left:14px;bottom:14px;background:var(--bg)}
.info{display:grid;gap:0;border-top:1px solid var(--line)}
.info>div{display:grid;grid-template-columns:minmax(110px,32%) 1fr;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.info dt{font-size:11.5px;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3);padding-top:4px}
.info dd{font-size:17px}.info dd a{border-bottom:1px solid var(--line);transition:border-color .4s}.info dd a:hover{border-color:var(--ink)}

/* ---------- footer ---------- */
.ftr{background:var(--inv-bg);color:var(--inv-ink);--ink:var(--inv-ink);--ink-2:rgba(243,239,231,.72);--ink-3:rgba(243,239,231,.5);--line:var(--inv-line);--bg:#2B2A28;padding-top:clamp(70px,9vw,140px)}
.ftr__top{display:grid;gap:44px;padding-bottom:clamp(56px,7vw,110px)}
.ftr__brand .d2{margin-bottom:22px}
.ftr__cols{display:grid;grid-template-columns:1fr 1fr;gap:40px var(--gap)}
.ftr h4{font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);margin-bottom:18px}
.ftr__cols li{margin-bottom:9px;font-size:15.5px}
.ftr__cols a{opacity:.86;transition:opacity .3s}.ftr__cols a:hover{opacity:1;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.ftr__bot{border-top:1px solid var(--line);padding:22px 0 26px;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;font-size:12.5px;color:var(--ink-3)}
.ftr__bot a:hover{color:var(--inv-ink)}
.ftr__bot button{font-size:12.5px;color:inherit;border-bottom:1px solid var(--line);padding-bottom:2px}
@media(min-width:1024px){.ftr__top{grid-template-columns:5fr 7fr}.ftr__cols{grid-template-columns:repeat(3,1fr)}}

/* ---------- misc ---------- */
.hd{display:flex;justify-content:space-between;align-items:end;gap:20px 40px;flex-wrap:wrap;margin-bottom:clamp(34px,4.5vw,70px)}
.hd .body{max-width:44ch}
.mt-s{margin-top:22px}.mt-m{margin-top:clamp(30px,4vw,56px)}.mt-l{margin-top:clamp(56px,8vw,120px)}
.col-l,.col-r,.col-m{grid-column:1/-1}
@media(min-width:900px){.col-l{grid-column:1/6}.col-r{grid-column:7/13}.col-m{grid-column:3/11}}
@media(min-width:1200px){.col-l{grid-column:1/5}.col-r{grid-column:6/13}}
.stat{display:grid;gap:6px}
.steps{display:grid;gap:0;border-top:1px solid var(--line)}
.notfound{min-height:80svh;display:grid;align-content:center;padding-top:var(--hdr)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .rv,.rv-img,.ln>span,.rv-line{opacity:1!important;transform:none!important;clip-path:none!important}
  .rv-img .ph-i{transform:none!important;clip-path:none!important}
  .hero__slabs,.pt{display:none!important}
}
@media print{.hdr,.mcta,.pt,.joints,.menu{display:none!important}}

/* ---------- additions ---------- */
.ph-i{translate:0 var(--py,0px)}
.zoom-a .ph-i{scale:2;transform-origin:24% 30%}
.zoom-b .ph-i{scale:3;transform-origin:74% 66%}
.toast{position:fixed;left:var(--pad);bottom:calc(24px + env(safe-area-inset-bottom));z-index:95;max-width:min(440px,calc(100vw - 2*var(--pad)));background:var(--ink);color:var(--bg);padding:16px 20px;font-size:14.5px;line-height:1.45;
  transform:translateY(24px);opacity:0;pointer-events:none;transition:opacity .5s var(--ease),transform .6s var(--ease)}
.toast.is-on{opacity:1;transform:none}
@media(max-width:899px){.toast{bottom:calc(70px + env(safe-area-inset-bottom))}}
@media(min-width:1024px){.form-col{grid-column:1/8!important}.form-side{grid-column:9/13!important;position:sticky;top:calc(var(--hdr) + 30px);align-self:start}}
.pgal{display:grid;grid-template-columns:1fr;gap:var(--gap)}
.pgal .stack>*+*{margin-top:var(--gap)}
@media(min-width:760px){.pgal{grid-template-columns:1.5fr 1fr}}
#app:focus{outline:none}
html:not(.is-loaded) .hero__slabs i{transform:none}

@media(min-width:1200px){.row--2{grid-template-columns:70px 1fr}}
@media(max-width:899px){.hero__slide .ph-i{object-position:var(--mx,50%) center}}
.pv .ph-i{--ov:0%;scale:var(--sc,1);transform-origin:var(--bx,50%) var(--by,50%);filter:var(--bf,none)}
.fld label.drop{text-transform:none;letter-spacing:0;font-size:inherit;font-weight:300;color:var(--ink)}
.q figure{margin-top:36px}
.hero__slide.is-flip{transform:scaleX(-1)}

/* ---------- responsive: dorade ---------- */
@media(max-width:479px){.btn{white-space:normal;text-align:center;line-height:1.35;padding:13px 22px}.btns .btn{flex:1 1 auto}}
.ftr__cols li{margin-bottom:3px}.ftr__cols a{display:inline-block;padding:4px 0}
.hdr__upit{display:inline-flex;align-items:center;min-height:44px;padding:0 2px;border-bottom:0;background:linear-gradient(currentColor,currentColor) 0 calc(50% + 12px)/100% 1px no-repeat}
.ftr__bot button{padding:7px 0 3px}
@media(max-width:380px){.d1{font-size:clamp(34px,11.8vw,46px)}}
/* niski ekrani (telefon u pejzažu): hero raste sa sadržajem umjesto da ga siječe */
@media(max-height:560px){.hero{height:auto;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end}
  .hero__body{position:relative;padding-top:calc(var(--hdr) + 22px)}.hero .d1{font-size:clamp(34px,13vh,68px)}.hero__row{margin-top:14px;gap:14px 28px}
  .phero{min-height:0}.phero__in{padding-top:calc(var(--hdr) + 28px)}.phero .d1,.thead .d1{font-size:clamp(34px,14vh,72px)}.thead{padding-top:calc(var(--hdr) + 32px)}}
@media(min-width:600px) and (max-width:1023px){.cidx__mob .ph{aspect-ratio:21/9}}
@media(min-width:1024px) and (max-width:1199px){.cidx__list .cidx__m{display:none}}
@media(min-width:1200px){.cidx__a{grid-template-columns:44px auto minmax(0,1fr)}.cidx__m{justify-self:end}}
.crumbs a,.crumbs span{display:inline-block;padding:6px 0}.crumbs{gap:0 12px}
.ftr__bot a{display:inline-block;padding:5px 0}
/* meni: zaključaj skrol stranice dok je otvoren; na niskim ekranima (pejzaž) stavke u dvije kolone */
html.menu-open,html.menu-open body{overflow:hidden}
.menu{overscroll-behavior:contain}
@media(max-height:560px){.menu{padding-top:calc(var(--hdr) + 4px)}.menu ul{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gap)}.menu li a{font-size:clamp(22px,6.4vh,30px);padding:9px 0}.menu__ft{padding-top:16px;grid-template-columns:auto 1fr;align-items:center;gap:20px}.menu__ft .btn{min-height:46px}}
/* hero se otkriva sa .is-ready, ne preko IntersectionObservera: donji red je uz samu ivicu ekrana, van zone posmatranja */
.hero.is-ready .rv{opacity:1;transform:none}
.hero.is-ready .ln>span{transform:none}
.hrs{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 18px}.hrs span:nth-child(even){white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}