:root {
  --bg:    #f6f5f2;       /* warm off-white */
  --bg-2:  #ffffff;       /* pure white surface */
  --bg-3:  #efede8;       /* light grey surface */
  --dark:  #0a0a0c;       /* cinematic dark */
  --ink:   #15151a;
  --ink-2: #3a3a42;
  --muted: #6e6e77;
  --red:   #ed1b24;
  --red-2: #ff2630;
  --line:  rgba(20,20,26,0.10);
  --line-2:rgba(20,20,26,0.16);
}
* { margin:0; padding:0; box-sizing:border-box; }
body { background:var(--bg); color:var(--ink); font-family:"Inter",system-ui,sans-serif; overflow-x:hidden; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; }
h1,h2,h3 { font-family:"Oswald","Inter",sans-serif; font-weight:600; }
.accent { color:var(--red); }

/* top scroll progress */
.scroll-progress { position:fixed; top:0; left:0; height:3px; width:0%; background:var(--red); z-index:120; box-shadow:0 0 10px rgba(237,27,36,.6); transition:width .08s linear; }

/* preloader (light) */
#preloader { position:fixed; inset:0; z-index:200; background:var(--bg); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:26px; transition:opacity .6s ease; }
#preloader.done { opacity:0; pointer-events:none; }
.pre-logo { width:min(170px,40vw); height:auto; }
.pre-bar { width:min(240px,55vw); height:2px; background:rgba(20,20,26,.12); overflow:hidden; }
.pre-bar-fill { height:100%; width:0%; background:var(--red); box-shadow:0 0 10px rgba(237,27,36,.5); transition:width .2s ease; }
.pre-pct { font-size:11px; letter-spacing:.34em; color:var(--muted); }

/* nav (adaptive) */
.nav { position:fixed; top:0; left:0; right:0; z-index:90; display:flex; align-items:center; justify-content:space-between; padding:20px 40px 26px; background:transparent; transition:padding .35s ease; }
.nav::before { content:""; position:absolute; left:0; right:0; top:0; height:160px; pointer-events:none; z-index:0; background:linear-gradient(180deg, rgba(8,8,10,.92) 0%, rgba(8,8,10,.74) 36%, rgba(8,8,10,.36) 66%, rgba(8,8,10,0) 100%); transition:background .35s ease; }
.nav > * { position:relative; z-index:1; }
.nav.scrolled { padding-top:14px; padding-bottom:22px; }
.nav.scrolled::before { background:linear-gradient(180deg, rgba(8,8,10,.96) 0%, rgba(8,8,10,.82) 40%, rgba(8,8,10,.42) 70%, rgba(8,8,10,0) 100%); }
.nav-brand { display:inline-flex; align-items:center; }
.nav-brand img { height:26px; width:auto; }
.logo-on-dark { display:block; }
.logo-on-light { display:none; }
.nav-links { display:flex; gap:36px; }
.nav-links a { color:rgba(255,255,255,.82); text-decoration:none; font-size:12.5px; font-weight:600; letter-spacing:.15em; text-transform:uppercase; transition:color .2s; }
.nav-links a:hover { color:var(--red); }
.nav-cta { font-size:12.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#fff; text-decoration:none; border:1px solid rgba(255,255,255,.42); padding:10px 22px; border-radius:3px; transition:background .2s,border-color .2s,color .2s,box-shadow .2s; }
.nav-cta:hover { background:var(--red); border-color:var(--red); box-shadow:0 0 22px rgba(237,27,36,.45); }

/* cinematic scrub (dark) */
.cinematic { position:relative; height:520vh; background:var(--dark); }
#hero { height:620vh; }
#detail { height:460vh; }
.sticky { position:sticky; top:0; height:100vh; width:100%; overflow:hidden; background:var(--dark); }
.cinematic canvas { position:absolute; inset:0; width:100%; height:100%; }
.vignette { position:absolute; inset:0; pointer-events:none; background:radial-gradient(120% 90% at 50% 45%,transparent 46%,rgba(0,0,0,.66) 100%),linear-gradient(180deg,rgba(0,0,0,.5) 0%,transparent 22%,transparent 70%,rgba(0,0,0,.72) 100%); }
.overlay { position:absolute; inset:0; z-index:10; pointer-events:none; }
.reveal-line { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:max-content; max-width:92vw; text-align:center; opacity:0; will-change:opacity,transform; color:#fff; }
.reveal-line h1 { font-weight:700; font-size:clamp(2.6rem,8vw,7rem); line-height:1.02; letter-spacing:.005em; text-transform:uppercase; text-shadow:0 4px 70px rgba(0,0,0,.9); }
.reveal-line .eyebrow { color:var(--red); }
.reveal-line .sub { margin-top:20px; font-size:clamp(.95rem,1.6vw,1.15rem); font-weight:500; letter-spacing:.06em; color:rgba(255,255,255,.85); font-family:"Inter",sans-serif; }
.eyebrow { font-size:11.5px; font-weight:700; letter-spacing:.36em; color:var(--red); margin-bottom:18px; text-transform:uppercase; font-family:"Inter",sans-serif; }

.scrub-progress { position:absolute; left:40px; right:40px; bottom:42px; height:2px; background:rgba(255,255,255,.18); z-index:12; }
.scrub-progress-fill { height:100%; width:0%; background:var(--red); box-shadow:0 0 16px rgba(237,27,36,.8); }
.scroll-hint { position:absolute; bottom:14px; left:50%; transform:translateX(-50%); z-index:12; font-size:11px; font-weight:700; letter-spacing:.42em; color:rgba(255,255,255,.6); animation:bob 1.9s ease-in-out infinite; transition:opacity .4s; font-family:"Inter",sans-serif; }
@keyframes bob { 0%,100%{transform:translateX(-50%) translateY(0);} 50%{transform:translateX(-50%) translateY(6px);} }

/* light bands */
.band { background:var(--bg); position:relative; }
.band .wrap { max-width:1140px; margin:0 auto; padding:140px 40px; }
.band .eyebrow { margin-bottom:20px; }
.band h2 { font-size:clamp(2rem,4.6vw,3.5rem); line-height:1.08; letter-spacing:.005em; margin-bottom:26px; text-transform:uppercase; color:var(--ink); }
.band h2.underline { position:relative; padding-bottom:22px; }
.band h2.underline::after { content:""; position:absolute; left:0; bottom:0; height:3px; width:0; background:var(--red); transition:width .8s cubic-bezier(.2,.6,.2,1) .15s; }
.band h2.underline.in::after { width:56px; }
.lede { max-width:660px; font-size:1.12rem; line-height:1.78; color:var(--muted); }

/* stats */
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:74px; border-top:1px solid var(--line); padding-top:54px; }
.stat-num { display:block; font-family:"Oswald",sans-serif; font-weight:700; font-size:clamp(3rem,6vw,4.8rem); color:var(--ink); line-height:1; }
.stat-label { display:block; margin-top:12px; font-size:.95rem; letter-spacing:.04em; color:var(--muted); }

/* gallery (compact) */
.gallery { background:var(--bg-2); }
.gal-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:46px; }
.gal-compact { grid-template-columns:repeat(3,1fr); gap:12px; margin-top:36px; max-width:900px; }
.gal-item { position:relative; overflow:hidden; background:#ddd; border-radius:3px; box-shadow:0 10px 30px rgba(0,0,0,.08); }
.gal-item { aspect-ratio:4/3; }
.gal-item img { width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.6,.2,1); }
.gal-item:hover img { transform:scale(1.05); }
.gal-item figcaption { position:absolute; left:0; right:0; bottom:0; padding:38px 22px 18px; font-family:"Oswald",sans-serif; font-size:.92rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#fff; background:linear-gradient(0deg,rgba(0,0,0,.72),transparent); opacity:0; transform:translateY(8px); transition:opacity .4s,transform .4s; }
.gal-item:hover figcaption { opacity:1; transform:translateY(0); }

/* brand logo tiles (light) */
.brands { background:var(--bg-3); }
.logo-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; margin-top:40px; }
.logo-tile { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; min-height:158px; padding:26px 18px; background:var(--bg-2); border:1px solid var(--line); border-radius:4px; overflow:hidden; transition:transform .3s cubic-bezier(.2,.6,.2,1),border-color .3s,box-shadow .3s; }
.logo-tile::before { content:""; position:absolute; left:0; top:0; height:3px; width:100%; transform:scaleX(0); transform-origin:left; background:var(--red); transition:transform .35s cubic-bezier(.2,.6,.2,1); }
.logo-tile img { max-height:56px; max-width:80%; width:auto; object-fit:contain; transition:transform .35s cubic-bezier(.2,.6,.2,1); }
.logo-tile .lt-name { font-family:"Oswald",sans-serif; font-weight:600; font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; text-align:center; color:var(--muted); transition:color .3s; }
.logo-tile:hover { transform:translateY(-5px); border-color:transparent; box-shadow:0 18px 44px rgba(0,0,0,.13); }
.logo-tile:hover::before { transform:scaleX(1); }
.logo-tile:hover img { transform:scale(1.07); }
.logo-tile:hover .lt-name { color:var(--ink); }
.brands-more { margin-top:30px; font-size:.95rem; color:var(--muted); letter-spacing:.02em; line-height:1.7; }
.h2-second { margin-top:96px; }

/* services (light, numbered) */
.services { background:var(--bg); }
.svc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:46px; }
.svc { position:relative; border:1px solid var(--line); border-radius:3px; padding:36px 30px 34px; background:var(--bg-2); overflow:hidden; transition:transform .3s,box-shadow .3s; }
.svc::before { content:""; position:absolute; left:0; top:0; width:3px; height:100%; transform:scaleY(0); transform-origin:top; background:var(--red); transition:transform .35s cubic-bezier(.2,.6,.2,1); }
.svc:hover { transform:translateY(-5px); box-shadow:0 18px 44px rgba(0,0,0,.12); }
.svc:hover::before { transform:scaleY(1); }
.svc-num { font-family:"Oswald",sans-serif; font-weight:700; font-size:.95rem; letter-spacing:.1em; color:var(--red); }
.svc h3 { font-size:1.25rem; margin:14px 0 12px; letter-spacing:.01em; text-transform:uppercase; }
.svc p { color:var(--muted); line-height:1.66; font-size:.97rem; }


/* cinematic dissolve overlays (JS-driven opacity) */
.cine-fade { position:absolute; left:0; right:0; pointer-events:none; z-index:6; opacity:0; will-change:opacity; }
.cine-fade-top { top:0; height:52vh; background:linear-gradient(180deg, var(--bg) 0%, var(--bg) 14%, rgba(246,245,242,0) 100%); }
.cine-fade-bottom { bottom:0; height:42vh; background:linear-gradient(0deg, var(--bg) 0%, var(--bg) 12%, rgba(246,245,242,0) 100%); }

/* lager / instagram feed (uniform squares) */
.feed { background:var(--bg); }
.feed-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:44px; }
.feed-item { position:relative; display:block; aspect-ratio:1/1; overflow:hidden; border-radius:4px; background:#ddd; box-shadow:0 10px 30px rgba(0,0,0,.08); }
.feed-item img { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.6,.2,1); }
.feed-item::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(0,0,0,.34), transparent 55%); opacity:0; transition:opacity .4s; }
.feed-item .feed-ig { position:absolute; right:14px; bottom:11px; z-index:2; color:#fff; font-size:1.25rem; font-weight:700; opacity:0; transform:translateY(6px); transition:opacity .4s, transform .4s; }
.feed-item:hover img { transform:scale(1.06); }
.feed-item:hover::after { opacity:1; }
.feed-item:hover .feed-ig { opacity:1; transform:translateY(0); }
.feed-cta { margin-top:34px; display:flex; gap:14px; flex-wrap:wrap; }
/* lager premium grid */
.lager-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:44px; }
.lager-item { margin:0; position:relative; }
.lager-media { position:relative; aspect-ratio:3/4; overflow:hidden; border-radius:4px; background:#e8e6e1; box-shadow:0 14px 40px rgba(0,0,0,.10); }
.lager-media img { width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.6,.2,1); }
.lager-media::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(10,10,12,.42), transparent 46%); opacity:.85; transition:opacity .45s; }
.lager-media::before { content:""; position:absolute; left:0; bottom:0; height:3px; width:0; background:var(--red); z-index:2; transition:width .5s cubic-bezier(.2,.6,.2,1); }
.lager-item:hover .lager-media img { transform:scale(1.06); }
.lager-item:hover .lager-media::after { opacity:1; }
.lager-item:hover .lager-media::before { width:100%; }
.lager-item figcaption { position:absolute; left:20px; right:20px; bottom:16px; z-index:2; display:flex; flex-direction:column; gap:3px; transition:transform .45s cubic-bezier(.2,.6,.2,1); }
.lager-item:hover figcaption { transform:translateY(-4px); }
.lager-name { font-family:"Oswald",sans-serif; font-weight:600; font-size:1.06rem; letter-spacing:.03em; text-transform:uppercase; color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.55); }
.lager-sub { font-size:.78rem; font-weight:600; letter-spacing:.09em; text-transform:uppercase; color:rgba(255,255,255,.62); opacity:0; transform:translateY(4px); transition:opacity .45s, transform .45s; }
.lager-item:hover .lager-sub { opacity:1; transform:translateY(0); }
.feed-embeds { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:44px; align-items:start; }
.feed-embeds .instagram-media { margin:0 !important; min-width:0 !important; width:100% !important; }
.social-btn { font-family:"Oswald",sans-serif; font-weight:600; font-size:1rem; letter-spacing:.05em; text-transform:uppercase; color:var(--ink); text-decoration:none; border:1px solid var(--line-2); padding:16px 34px; border-radius:3px; transition:border-color .2s,color .2s,box-shadow .2s,background .2s; }
.social-btn:hover { border-color:var(--red); background:var(--red); color:#fff; box-shadow:0 0 24px rgba(237,27,36,.3); }
.social-btn.btn-primary { background:var(--red); border-color:var(--red); color:#fff; }
.social-btn.btn-primary:hover { background:var(--red-2); box-shadow:0 10px 28px rgba(237,27,36,.38); }

/* lager page */
.lager-page .wrap { padding-top:10px; }

/* posts / novosti page */
.posts-intro .wrap { padding-top:126px; padding-bottom:28px; }
.underline-static { font-family:"Oswald",sans-serif; font-weight:600; font-size:clamp(2rem,4.6vw,3.5rem); line-height:1.08; text-transform:uppercase; color:var(--ink); position:relative; padding-bottom:22px; margin-bottom:24px; }
.underline-static::after { content:""; position:absolute; left:0; bottom:0; height:3px; width:56px; background:var(--red); }
.back-link { display:inline-block; margin-top:28px; font-size:.95rem; font-weight:600; letter-spacing:.04em; color:var(--muted); text-decoration:none; transition:color .2s; }
.back-link:hover { color:var(--red); }
.nav-links a.is-active { color:var(--red); }
.posts-grid { max-width:1140px; margin:0 auto; padding:10px 40px 120px; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:start; }
.posts-grid .instagram-media { margin:0 !important; min-width:0 !important; width:100% !important; }

/* footer (light) */
footer { background:var(--bg-3); border-top:1px solid var(--line); display:flex; flex-direction:column; align-items:center; gap:10px; padding:44px 20px 40px; }
.f-logo { height:24px; width:auto; }
.f-note { color:var(--muted); font-size:.92rem; letter-spacing:.04em; }
.f-demo { color:var(--muted); opacity:.55; font-size:.78rem; letter-spacing:.06em; }

/* reveals */
.reveal { opacity:0; transform:translateY(30px); transition:opacity .8s cubic-bezier(.2,.6,.2,1),transform .8s cubic-bezier(.2,.6,.2,1); }
.reveal.in { opacity:1; transform:translateY(0); }

@media (prefers-reduced-motion:reduce){ .reveal{transition:none;opacity:1;transform:none;} .scroll-hint{animation:none;} .gal-item:hover img{transform:none;} .band h2.underline.in::after{transition:none;} }
:focus-visible { outline:2px solid var(--red); outline-offset:3px; }

/* tablet */
@media (max-width:900px){
  .logo-grid { grid-template-columns:repeat(3,1fr); }
  .svc-grid { grid-template-columns:repeat(2,1fr); }
  .posts-grid { grid-template-columns:repeat(2,1fr); }
  .feed-embeds { grid-template-columns:repeat(2,1fr); }
  .lager-grid { grid-template-columns:repeat(2,1fr); }
}
/* mobile */
@media (max-width:720px){
  .nav { padding:14px 18px 22px; }
  .nav.scrolled { padding:12px 18px 18px; }
  .nav-links { display:none; }
  .nav-brand img { height:22px; }
  .nav-cta { padding:9px 16px; font-size:11.5px; }
  .band .wrap { padding:92px 20px; }
  .stats { grid-template-columns:1fr; gap:38px; }
  .logo-grid { grid-template-columns:repeat(2,1fr); }
  .svc-grid { grid-template-columns:1fr; }
  .gal-grid, .gal-compact { grid-template-columns:1fr; }
  .gal-item { aspect-ratio:16/10; }
  .scrub-progress { left:18px; right:18px; }
  .desktop-br { display:none; }
  .feed-grid { grid-template-columns:repeat(2,1fr); }
  .feed-embeds { grid-template-columns:1fr; }
  .lager-grid { grid-template-columns:repeat(2,1fr); gap:12px; }
  .lager-item figcaption { left:12px; right:12px; bottom:10px; }
  .lager-name { font-size:.86rem; }
  .posts-grid { grid-template-columns:1fr; padding:10px 20px 90px; }
}

/* locations (map footer, light) */
.locations-dark { background:var(--bg-3); border-top:1px solid var(--line); }
#locmap { height:420px; width:100%; background:#e4e2dd; border-bottom:1px solid var(--line); }
#locmap .leaflet-tile-pane { filter:grayscale(1) brightness(.94) contrast(.96); }
.leaflet-container { background:var(--bg-3) !important; font-family:"Inter",sans-serif; }
.leaflet-control-attribution { background:rgba(246,245,242,.78) !important; color:rgba(21,21,26,.38) !important; font-size:.66rem !important; }
.leaflet-control-attribution a { color:rgba(21,21,26,.5) !important; }
.map-label { background:#fff; border:1px solid var(--red); color:var(--ink); font-family:"Oswald",sans-serif; font-weight:600; font-size:.72rem; letter-spacing:.14em; padding:4px 10px; border-radius:2px; box-shadow:0 4px 14px rgba(0,0,0,.10); }
.map-label::before { display:none; }
.ldk-grid { max-width:1140px; margin:0 auto; padding:60px 40px 8px; display:flex; justify-content:space-between; gap:48px; }
.ldk-loc { max-width:340px; }
.ldk-right { text-align:right; }
.ldk-loc h4 { font-family:"Oswald",sans-serif; font-weight:600; font-size:.85rem; letter-spacing:.22em; color:var(--red); margin-bottom:16px; }
.ldk-addr { color:var(--ink); font-size:1.02rem; line-height:1.65; margin-bottom:14px; }
.ldk-meta { margin-bottom:12px; line-height:1.8; }
.ldk-meta .tel { color:var(--muted); text-decoration:none; font-size:.95rem; transition:color .2s; }
.ldk-meta .tel:hover { color:var(--red); }
.ldk-hours { color:var(--muted); opacity:.7; font-size:.82rem; letter-spacing:.05em; }
.ldk-shared { max-width:1140px; margin:0 auto; padding:26px 40px 60px; display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; }
.ldk-line { display:flex; align-items:center; gap:16px; flex-wrap:wrap; justify-content:center; }
.ldk-shared .tel { color:var(--ink); text-decoration:none; font-size:1rem; font-weight:600; letter-spacing:.03em; transition:color .2s; }
.ldk-shared .tel:hover { color:var(--red); }
.ldk-dot { color:var(--red); font-weight:700; }
.ldk-h { color:var(--muted); font-size:.92rem; letter-spacing:.05em; }
@media (max-width:760px){
  #locmap { height:300px; }
  .ldk-grid { flex-direction:column; gap:32px; padding:46px 22px 4px; }
  .ldk-right { text-align:left; }
  .ldk-shared { padding:22px 22px 46px; gap:8px; }
}