
/* ─── TOKENS ─── */
:root{
  --white:#ffffff;
  --off:#f7f9fc;
  --light:#e8edf4;
  --mid:#8a97a8;
  --dark:#3a4a5c;
  --ink:#1a2535;
  --gold:#1e6fa8;
  --gold2:#3a9fd6;
  --nav-h:72px;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter',sans-serif;
  font-weight:300;
  background:var(--white);
  color:var(--ink);
  overflow-x:hidden;
  cursor:default;
}
img{display:block;object-fit:cover;}
button,a{font-family:inherit;cursor:pointer;text-decoration:none;color:inherit;border:none;background:none;}

/* ─── HERO SLIDER ─── */
#hero{
  height:100vh;min-height:600px;
  position:relative;overflow:hidden;
}
.sl-track{
  position:absolute;inset:0;
  display:flex;transition:none;
}
.sl-slide{
  position:absolute;inset:0;
  opacity:0;transition:opacity .9s ease;
  pointer-events:none;
}
.sl-slide.active{opacity:1;pointer-events:all;}
.sl-bg{
  position:absolute;inset:0;
  background:#1a2535;
}
.sl-bg img{
  width:100%;height:100%;object-fit:cover;
  opacity:.55;
}

.sl-grad{
  position:absolute;inset:0;z-index:3;
  background:linear-gradient(to top,rgba(10,18,30,.85) 0%,rgba(10,18,30,.15) 55%,transparent 100%);
}
.sl-content{
  position:absolute;bottom:0;left:0;right:0;z-index:4;
  padding:0 80px 90px;
  max-width:860px;
}
.sl-tag{
  font-size:11px;letter-spacing:4px;text-transform:uppercase;
  color:#3a9fd6;margin-bottom:20px;
  display:flex;align-items:center;gap:14px;
  opacity:0;transform:translateY(16px);
  transition:opacity .6s ease .2s,transform .6s ease .2s;
}
.sl-slide.active .sl-tag{opacity:1;transform:none;}
.sl-tag::before{content:'';display:block;width:32px;height:1px;background:#3a9fd6;}
.sl-h1{
  font-family:'Cormorant',serif;
  font-size:clamp(50px,7.5vw,100px);
  font-weight:300;line-height:.95;
  color:#fff;letter-spacing:-1px;margin-bottom:28px;
  opacity:0;transform:translateY(24px);
  transition:opacity .7s ease .35s,transform .7s ease .35s;
}
.sl-slide.active .sl-h1{opacity:1;transform:none;}
.sl-h1 em{font-style:italic;color:var(--gold2);}
.sl-sub{
  font-size:15px;color:rgba(255,255,255,.6);
  line-height:1.8;max-width:460px;margin-bottom:36px;
  font-weight:300;
  opacity:0;transform:translateY(20px);
  transition:opacity .7s ease .5s,transform .7s ease .5s;
}
.sl-slide.active .sl-sub{opacity:1;transform:none;}
.sl-btns{
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  opacity:0;transform:translateY(16px);
  transition:opacity .6s ease .65s,transform .6s ease .65s;
}
.sl-slide.active .sl-btns{opacity:1;transform:none;}
/* arrows */
.sl-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  z-index:10;
  width:52px;height:52px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  color:#fff;font-size:20px;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:all .25s;
  backdrop-filter:blur(4px);
}
.sl-arrow:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.5);}
.sl-arrow.left{left:32px;}
.sl-arrow.right{right:32px;}
/* dots */
.sl-dots{
  position:absolute;bottom:28px;left:50%;transform:translateX(-50%);
  z-index:10;display:flex;gap:10px;align-items:center;
}
.sl-dot{
  width:6px;height:6px;border-radius:50%;
  background:rgba(255,255,255,.3);border:none;cursor:pointer;
  transition:all .3s;
}
.sl-dot.on{background:#fff;width:22px;border-radius:3px;}
/* progress bar */
.sl-progress{
  position:absolute;top:0;left:0;height:2px;
  background:#3a9fd6;z-index:10;
  width:0%;transition:width linear;
}
/* scroll indicator */
.hero-scroll{
  position:absolute;bottom:36px;right:60px;z-index:10;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  color:rgba(255,255,255,.4);
  font-size:9px;letter-spacing:2.5px;text-transform:uppercase;
}
.hero-scroll-line{
  width:1px;height:50px;
  background:linear-gradient(to bottom,rgba(255,255,255,.4),transparent);
  animation:scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse{0%,100%{opacity:.4}50%{opacity:1}}
/* slide count badge */
.sl-count{
  position:absolute;top:50%;right:32px;transform:translateY(-50%);
  z-index:10;writing-mode:vertical-rl;
  font-size:10px;letter-spacing:3px;
  color:rgba(255,255,255,.35);text-transform:uppercase;
  display:flex;align-items:center;gap:10px;
}
.sl-count-sep{width:30px;height:1px;background:rgba(255,255,255,.2);transform:rotate(90deg);}

/* ─── NAV ─── */
#nav{
  position:fixed;top:0;left:0;right:0;z-index:800;
  height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 48px;
  transition:background .4s,border-color .4s,backdrop-filter .4s;
}
#nav.solid{
  background:rgba(255,255,255,.96);
  border-bottom:1px solid var(--light);
  backdrop-filter:blur(12px);
}
#nav.hero-top{
  background:transparent;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.nav-logo{
  display:flex;align-items:center;
  transition:opacity .3s;
}
.nav-logo-img{
  height:30px;width:auto;display:block;
}
.nav-logo-d{display:none;}
#nav.solid .nav-logo-w{display:none;}
#nav.solid .nav-logo-d{display:block;}
.nav-center{
  display:flex;align-items:center;gap:0;
}
.nav-item{
  position:relative;
}
.nav-item>button{
  font-size:12px;font-weight:400;letter-spacing:1.5px;text-transform:uppercase;
  color:rgba(255,255,255,.85);padding:0 20px;height:var(--nav-h);
  display:flex;align-items:center;gap:5px;
  transition:color .25s;
}
#nav.solid .nav-item>button{color:var(--dark);}
.nav-item>button:hover,#nav.solid .nav-item>button:hover{color:var(--gold);}
.nav-caret{
  width:0;height:0;
  border-left:4px solid transparent;
  border-right:4px solid transparent;
  border-top:4px solid currentColor;
  transition:transform .2s;
  margin-top:1px;
}
.nav-item.open>.nav-caret,.nav-item:hover .nav-caret{transform:rotate(180deg);}
/* mega dropdown */
.mega{
  position:fixed;top:var(--nav-h);left:0;right:0;
  background:var(--white);
  border-top:2px solid var(--gold);
  border-bottom:1px solid var(--light);
  display:none;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  box-shadow:0 20px 60px rgba(0,0,0,.1);
  z-index:799;
}
.nav-item:hover .mega{display:grid;}
.mega-col{
  padding:36px 32px;
  border-right:1px solid var(--light);
}
.mega-col:last-child{border-right:none;}
.mega-col-title{
  font-size:10px;letter-spacing:2.5px;text-transform:uppercase;
  color:var(--gold);margin-bottom:18px;
  padding-bottom:10px;border-bottom:1px solid var(--light);
}
.mega-link{
  display:block;font-size:13px;color:var(--dark);
  padding:6px 0;transition:color .2s, padding-left .2s;
  letter-spacing:.3px;
}
.mega-link:hover{color:var(--gold);padding-left:6px;}
/* right nav */
.nav-right{display:flex;align-items:center;gap:20px;}
.nav-contact{
  font-size:11px;font-weight:500;letter-spacing:2px;text-transform:uppercase;
  color:rgba(255,255,255,.9);
  padding:9px 22px;
  border:1px solid rgba(255,255,255,.35);
  transition:all .25s;
}
#nav.solid .nav-contact{
  color:var(--ink);border-color:var(--light);
}
.nav-contact:hover{
  background:var(--gold);border-color:var(--gold);color:var(--white)!important;
}
.hamburger{
  display:none;flex-direction:column;gap:5px;padding:6px;
}
.hamburger span{
  display:block;width:22px;height:1.5px;
  background:var(--white);transition:all .3s;
}
#nav.solid .hamburger span{background:var(--ink);}

/* ─── HERO ─── */
#hero{
  height:100vh;min-height:600px;
  position:relative;overflow:hidden;
  display:flex;align-items:flex-end;
}
.hero-media{
  position:absolute;inset:0;
  background:var(--ink);
}
.hero-media-img{
  width:100%;height:100%;
  object-fit:cover;opacity:.55;
  transition:opacity 1s;
}
.hero-media-img.loaded{opacity:.55;}
/* fallback gradient when no image */
.hero-grad{
  position:absolute;inset:0;
  background:linear-gradient(135deg,#1a2535 0%,#1e3050 40%,#1a2535 100%);
}
.hero-grid-overlay{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(30,111,168,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(30,111,168,.05) 1px,transparent 1px);
  background-size:70px 70px;
}
.hero-vignette{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(10,18,30,.85) 0%,rgba(10,18,30,.2) 50%,transparent 100%);
}
.hero-content{
  position:relative;z-index:2;
  padding:0 80px 80px;
  max-width:900px;
}
.hero-tag{
  font-size:11px;letter-spacing:4px;text-transform:uppercase;
  color:var(--gold);margin-bottom:24px;
  display:flex;align-items:center;gap:14px;
}
.hero-tag::before{content:'';display:block;width:40px;height:1px;background:var(--gold);}
.hero-h1{
  font-family:'Cormorant',serif;
  font-size:clamp(56px,8vw,110px);
  font-weight:300;line-height:.95;
  color:var(--white);
  letter-spacing:-1px;margin-bottom:32px;
}
.hero-h1 em{font-style:italic;color:var(--gold2);}
.hero-sub{
  font-size:15px;color:rgba(255,255,255,.65);
  line-height:1.8;max-width:480px;margin-bottom:40px;
  font-weight:300;letter-spacing:.3px;
}
.hero-btns{display:flex;align-items:center;gap:20px;flex-wrap:wrap;}
.btn-primary{
  display:inline-block;
  background:var(--gold);color:var(--white);
  padding:15px 36px;
  font-size:11px;font-weight:500;letter-spacing:2.5px;text-transform:uppercase;
  transition:background .25s;
}
.btn-primary:hover{background:#3a9fd6;}
.btn-ghost-white{
  display:inline-block;
  color:rgba(255,255,255,.8);
  padding:15px 0;
  font-size:11px;font-weight:400;letter-spacing:2px;text-transform:uppercase;
  border-bottom:1px solid rgba(255,255,255,.3);
  transition:all .25s;
}
.btn-ghost-white:hover{color:var(--white);border-color:var(--white);}
.hero-scroll{
  position:absolute;bottom:36px;right:60px;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  color:rgba(255,255,255,.4);
  font-size:9px;letter-spacing:2.5px;text-transform:uppercase;
}
.hero-scroll-line{
  width:1px;height:50px;
  background:linear-gradient(to bottom,rgba(255,255,255,.4),transparent);
  animation:scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse{0%,100%{opacity:.4}50%{opacity:1}}

/* ─── SECTION COMMONS ─── */
.section{padding:100px 80px;}
.eyebrow{
  font-size:10px;letter-spacing:3.5px;text-transform:uppercase;color:var(--gold);
  display:flex;align-items:center;gap:12px;margin-bottom:16px;
}
.eyebrow::before{content:'';display:block;width:28px;height:1px;background:var(--gold);}
.h2{
  font-family:'Cormorant',serif;
  font-size:clamp(34px,4.5vw,60px);font-weight:300;line-height:1.05;
  color:var(--ink);margin-bottom:16px;letter-spacing:-.5px;
}
.h2 em{font-style:italic;color:var(--gold);}
.lead{font-size:15px;color:var(--mid);line-height:1.8;max-width:500px;}

/* ─── INTRO STRIP ─── */
#intro{
  background:#1a2535;
  display:flex;align-items:center;
  padding:40px 80px;gap:80px;
  border-top:3px solid #1e6fa8;
}
.intro-stat{text-align:center;flex:1;}
.intro-stat-n{
  font-family:'Cormorant',serif;
  font-size:52px;font-weight:300;color:var(--white);line-height:1;
}
.intro-stat-l{
  font-size:10px;letter-spacing:2px;text-transform:uppercase;
  color:rgba(255,255,255,.5);margin-top:6px;
}
.intro-divider{width:1px;height:60px;background:rgba(255,255,255,.1);}

/* ─── TICKER ─── */
.ticker-wrap{overflow:hidden;background:#e8edf4;padding:14px 0;border-top:1px solid rgba(0,0,0,.06);}
.ticker{display:flex;width:max-content;animation:tick 32s linear infinite;}
.ticker-item{
  font-size:11px;letter-spacing:2.5px;text-transform:uppercase;
  color:var(--mid);padding:0 28px;white-space:nowrap;
  display:flex;align-items:center;gap:28px;
}
.ticker-gem{color:var(--gold);font-size:8px;}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ─── PRODUCTS ─── */
#produktet{background:var(--white);}
.prod-header{
  display:flex;align-items:flex-end;justify-content:space-between;
  margin-bottom:60px;gap:40px;flex-wrap:wrap;
}
.prod-view-all{
  font-size:11px;letter-spacing:2px;text-transform:uppercase;
  color:var(--gold);border-bottom:1px solid var(--gold);
  padding-bottom:2px;transition:color .25s;flex-shrink:0;
  align-self:flex-end;
}
.prod-view-all:hover{color:var(--dark);}

/* BENTO grid inspired by Panda */
.prod-bento{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  grid-template-rows:auto;
  gap:16px;
}
.pb-card{
  position:relative;overflow:hidden;
  background:var(--off);
  transition:box-shadow .3s;
}
.pb-card:hover{box-shadow:0 16px 48px rgba(0,0,0,.1);}
/* layout */
.pb-1{grid-column:1/7;grid-row:1/2;}/* large left */
.pb-2{grid-column:7/13;grid-row:1/2;}/* large right */
.pb-3{grid-column:1/5;grid-row:2/3;}/* small */
.pb-4{grid-column:5/9;grid-row:2/3;}/* small */
.pb-5{grid-column:9/13;grid-row:2/3;}/* small */

.pb-img{
  width:100%;height:340px;
  overflow:hidden;position:relative;
  background:var(--light);
}
.pb-1 .pb-img,.pb-2 .pb-img{height:420px;}
.pb-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;display:block;}
.pb-card:hover .pb-img img{transform:scale(1.04);}
/* upload placeholder */




.pb-upload-zone:hover 

.pb-upload-zone:hover 

.pb-img.has-img 



.pb-body{padding:24px 28px;}
.pb-tag{
  font-size:9px;letter-spacing:2.5px;text-transform:uppercase;
  color:var(--gold);margin-bottom:8px;
}
.pb-name{
  font-family:'Cormorant',serif;
  font-size:22px;font-weight:400;color:var(--ink);margin-bottom:6px;
}
.pb-desc{font-size:13px;color:var(--mid);line-height:1.7;}
.pb-arrow{
  display:inline-flex;align-items:center;gap:8px;margin-top:14px;
  font-size:11px;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--gold);transition:gap .25s;
}
.pb-card:hover .pb-arrow{gap:14px;}

/* ─── CATALOGUE SECTION ─── */
#katalogu{
  background:#1a2535;
  padding:0;
  display:grid;grid-template-columns:1fr 1fr;
  min-height:520px;
}
.cat-left-panel{
  padding:80px;
  display:flex;flex-direction:column;justify-content:center;
}
.cat-left-panel .eyebrow{color:var(--gold2);}
.cat-left-panel .eyebrow::before{background:#3a9fd6;}
.cat-left-panel .h2{color:var(--white);}
.cat-left-panel .lead{color:var(--mid);}
.cat-open-big{
  display:inline-flex;align-items:center;gap:16px;
  margin-top:36px;
  background:var(--gold);color:var(--white);
  padding:16px 36px;
  font-size:11px;font-weight:500;letter-spacing:2.5px;text-transform:uppercase;
  transition:background .25s;align-self:flex-start;
}
.cat-open-big:hover{background:#3a9fd6;}
.cat-open-big svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.5;}
.cat-right-panel{
  position:relative;overflow:hidden;
  background:var(--dark);
  min-height:400px;
}
.cat-right-panel-img{
  width:100%;height:100%;object-fit:cover;opacity:.4;
}
.cat-right-panel-overlay{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
}
.cat-page-count{
  font-family:'Cormorant',serif;
  font-size:120px;font-weight:300;
  color:rgba(255,255,255,.06);
  line-height:1;user-select:none;
}

/* ─── FLIPBOOK MODAL ─── */
#flipModal{
  display:none;position:fixed;inset:0;z-index:9000;
  width:100vw;height:100vh;height:100dvh;
  background:rgba(12,18,28,.98);
  flex-direction:column;
  overflow:hidden;
}
#flipModal.open{display:flex;}

.flip-top{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 24px;flex:0 0 auto;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.flip-brand-img{height:24px;width:auto;display:block;}
.flip-top-right{display:flex;align-items:center;gap:14px;}
.flip-zoom{
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,.65);
  border:1px solid rgba(255,255,255,.18);
  transition:all .2s;
}
.flip-zoom:hover{color:var(--white);border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.06);}
.flip-zoom svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;}
.flip-dl{
  display:flex;align-items:center;gap:8px;
  padding:9px 16px;
  border:1px solid rgba(255,255,255,.2);
  color:rgba(255,255,255,.6);
  font-size:10px;letter-spacing:1.5px;text-transform:uppercase;
  transition:all .25s;
}
.flip-dl:hover{border-color:var(--gold2);color:var(--gold2);}
.flip-dl svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8;}
.flip-close{
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,.55);
  border:1px solid rgba(255,255,255,.15);
  transition:all .2s;
}
.flip-close:hover{color:var(--white);border-color:rgba(255,255,255,.4);}
.flip-close svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.6;}

.flip-stage{
  flex:1;min-height:0;position:relative;
  display:flex;align-items:stretch;justify-content:center;
  padding:14px 60px;
  perspective:1800px;
}
#flipBook{
  flex:1;max-width:640px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;position:relative;
  background:#fff;border-radius:4px;
  box-shadow:0 30px 60px rgba(0,0,0,.55);
  cursor:pointer;
}
#flipBook img{
  max-width:100%;max-height:100%;width:auto;height:auto;
  display:block;object-fit:contain;
  user-select:none;-webkit-user-drag:none;-webkit-user-select:none;
  transform-origin:center center;
  backface-visibility:hidden;
  transition:transform .4s cubic-bezier(.22,.68,0,1.01), opacity .32s ease;
  will-change:transform,opacity;
}
#flipBook img.flip-out-next{transform:rotateY(-16deg) translateX(-5%) scale(.96);opacity:0;}
#flipBook img.flip-out-prev{transform:rotateY(16deg) translateX(5%) scale(.96);opacity:0;}
#flipBook img.flip-in-next{transform:rotateY(16deg) translateX(5%) scale(.96);opacity:0;}
#flipBook img.flip-in-prev{transform:rotateY(-16deg) translateX(-5%) scale(.96);opacity:0;}

.flip-tap-hint{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.9);
  display:flex;flex-direction:column;align-items:center;gap:12px;
  background:rgba(10,15,22,.88);border:1px solid rgba(255,255,255,.15);
  padding:22px 26px;border-radius:12px;
  opacity:0;transition:opacity .4s ease,transform .4s ease;
  pointer-events:none;z-index:20;max-width:240px;text-align:center;
}
.flip-tap-hint.show{opacity:1;transform:translate(-50%,-50%) scale(1);}
.flip-tap-hint svg{width:30px;height:30px;stroke:var(--gold2);fill:none;stroke-width:1.6;animation:tapPulse 1.4s ease-in-out infinite;}
.flip-tap-hint span{font-size:12.5px;letter-spacing:.3px;color:rgba(255,255,255,.85);line-height:1.5;}
@keyframes tapPulse{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.18);opacity:.7;}}

.flip-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.65);
  transition:all .2s;z-index:5;
}
.flip-arrow:hover{background:rgba(255,255,255,.14);color:var(--white);border-color:rgba(255,255,255,.35);}
.flip-arrow:disabled{opacity:.25;pointer-events:none;}
.flip-arrow svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;}
.flip-arrow-l{left:16px;}
.flip-arrow-r{right:16px;}

.flip-bottom{
  flex:0 0 auto;padding:10px 24px 20px;
}
.flip-thumbs{
  display:flex;gap:6px;overflow-x:auto;padding-bottom:10px;
  scrollbar-width:none;
}
.flip-thumbs::-webkit-scrollbar{display:none;}
.flip-thumb{
  flex:0 0 52px;height:70px;
  background-size:cover;background-position:center;
  border:1.5px solid rgba(255,255,255,.12);
  cursor:pointer;transition:all .2s;opacity:.55;
}
.flip-thumb:hover{opacity:.85;}
.flip-thumb.on{border-color:var(--gold2);opacity:1;}
.flip-progress-row{
  display:flex;align-items:center;gap:14px;
}
.flip-progress-row input[type=range]{
  flex:1;-webkit-appearance:none;appearance:none;
  height:2px;background:rgba(255,255,255,.18);outline:none;border-radius:2px;
}
.flip-progress-row input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:13px;height:13px;border-radius:50%;
  background:var(--gold2);cursor:pointer;
  border:2px solid #0c1218;
}
.flip-progress-row input[type=range]::-moz-range-thumb{
  width:13px;height:13px;border-radius:50%;
  background:var(--gold2);cursor:pointer;border:2px solid #0c1218;
}
.flip-info{
  font-family:'Cormorant',serif;font-size:15px;
  color:rgba(255,255,255,.45);white-space:nowrap;min-width:56px;text-align:right;
}

/* ─── ZOOM OVERLAY ─── */
#zoomOverlay{
  display:none;position:fixed;inset:0;z-index:9500;
  background:#0a0f16;
  flex-direction:column;
  touch-action:none;
}
#zoomOverlay.open{display:flex;}
.zoom-top{
  flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;
  padding:14px 20px;border-bottom:1px solid rgba(255,255,255,.08);
}
.zoom-info{
  font-family:'Cormorant',serif;font-size:15px;color:rgba(255,255,255,.55);
}
.zoom-top-right{display:flex;align-items:center;gap:10px;}
.zoom-reset,.zoom-close{
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,.65);
  border:1px solid rgba(255,255,255,.18);
  transition:all .2s;
}
.zoom-reset:hover,.zoom-close:hover{color:var(--white);border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.06);}
.zoom-reset svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8;}
.zoom-close svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.6;}
.zoom-frame{
  flex:1;min-height:0;overflow:hidden;position:relative;
  display:flex;align-items:center;justify-content:center;
  cursor:grab;
}
.zoom-frame.grabbing{cursor:grabbing;}
.zoom-frame img{
  max-width:100%;max-height:100%;
  width:auto;height:auto;
  user-select:none;-webkit-user-select:none;
  will-change:transform;
  transform-origin:0 0;
  background:#fff;
}
.zoom-hint{
  flex:0 0 auto;text-align:center;padding:10px;
  font-size:11px;letter-spacing:.5px;color:rgba(255,255,255,.3);
}

@media (max-width:720px){
  .flip-top{padding:10px 14px;}
  .flip-brand-img{height:20px;}
  .flip-top-right{gap:6px;}
  .flip-dl{font-size:0;padding:8px;gap:0;}
  .flip-dl svg{width:15px;height:15px;}
  .flip-zoom,.zoom-reset,.zoom-close{width:32px;height:32px;}
  .flip-stage{padding:6px 4px;}
  .flip-arrow{width:32px;height:32px;}
  .flip-arrow-l{left:0;}
  .flip-arrow-r{right:0;}
  .flip-thumbs{display:none;}
  .flip-bottom{padding:6px 14px 14px;}
  .flip-progress-row{gap:10px;}
  .flip-info{font-size:13px;min-width:44px;}
  .zoom-hint{font-size:10px;padding:8px;}
  .flip-tap-hint{max-width:200px;padding:18px 20px;}
}

/* ─── SERVICES ─── */
#sherbimet{background:var(--off);}
.srv-g{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--light);
  border:1px solid var(--light);margin-top:56px;
}
.srv{background:var(--white);padding:40px 32px;transition:background .3s;}
.srv:hover{background:var(--off);}
.srv-ic{
  width:44px;height:44px;border:1px solid var(--gold);
  display:flex;align-items:center;justify-content:center;margin-bottom:20px;
}
.srv-ic svg{width:20px;height:20px;stroke:var(--gold);fill:none;stroke-width:1.5;}
.srv-n{font-family:'Cormorant',serif;font-size:18px;font-weight:400;color:var(--ink);margin-bottom:8px;}
.srv-d{font-size:13px;color:var(--mid);line-height:1.7;}

/* ─── ABOUT ─── */
#rreth{
  display:grid;grid-template-columns:1fr 1fr;
  min-height:600px;
}
.ab-media{position:relative;overflow:hidden;background:var(--light);min-height:500px;}
.ab-media img{width:100%;height:100%;object-fit:cover;}
/* upload for about section */






.ab-media.has-img 


.ab-badge{
  position:absolute;top:40px;right:0;
  background:#1e6fa8;padding:20px 24px;
}
.ab-badge-n{
  font-family:'Cormorant',serif;
  font-size:44px;font-weight:300;color:var(--white);line-height:1;display:block;
}
.ab-badge-l{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.8);}
.ab-body{padding:80px 72px;display:flex;flex-direction:column;justify-content:center;background:var(--white);}
.ab-txt{font-size:15px;color:var(--mid);line-height:1.9;margin-bottom:20px;}
.ab-feats{display:grid;grid-template-columns:1fr 1fr;gap:18px 36px;margin-top:32px;}
.ab-f{padding-top:14px;border-top:1px solid var(--light);}
.ab-f-t{font-size:13px;font-weight:500;color:var(--ink);margin-bottom:3px;}
.ab-f-d{font-size:12px;color:var(--mid);line-height:1.5;}

/* ─── PARTNERS ─── */
#partners{
  background:#1a2535;padding:52px 80px;
  display:flex;align-items:center;gap:60px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.06);
}
.pt-lbl{
  font-size:10px;letter-spacing:3px;text-transform:uppercase;
  color:var(--mid);white-space:nowrap;flex-shrink:0;
}
.pt-logos{display:flex;align-items:center;gap:36px;flex-wrap:wrap;}
.pt-logo{
  font-family:'Cormorant',serif;
  font-size:15px;letter-spacing:2.5px;font-weight:400;
  color:rgba(255,255,255,.28);text-transform:uppercase;
  transition:color .25s;
}
.pt-logo:hover{color:var(--gold2);}

/* ─── CONTACT ─── */
#kontakti{background:var(--white);}
.k-g{display:grid;grid-template-columns:1fr 1.3fr;gap:80px;margin-top:56px;align-items:start;}
.k-info{display:flex;flex-direction:column;gap:24px;}
.k-item{display:flex;align-items:flex-start;gap:14px;}
.k-ico{
  width:38px;height:38px;flex-shrink:0;
  border:1px solid var(--light);
  display:flex;align-items:center;justify-content:center;
}
.k-ico svg{width:16px;height:16px;stroke:var(--gold);fill:none;stroke-width:1.5;}
.k-lbl{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--mid);margin-bottom:3px;}
.k-val{font-size:14px;color:var(--ink);line-height:1.5;}
.k-form{display:flex;flex-direction:column;gap:13px;}
.k-fl{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--mid);margin-bottom:4px;}
.k-in,.k-ta{
  width:100%;background:var(--off);
  border:1.5px solid var(--light);
  color:var(--ink);padding:12px 16px;
  font-family:'Inter',sans-serif;font-size:14px;font-weight:300;
  outline:none;transition:border-color .25s;
}
.k-in:focus,.k-ta:focus{border-color:var(--gold);}
.k-ta{height:100px;resize:none;}
.k-sub{
  background:var(--ink);color:var(--white);
  padding:14px;font-family:'Inter',sans-serif;
  font-size:11px;font-weight:500;letter-spacing:2.5px;text-transform:uppercase;
  cursor:pointer;transition:background .25s;margin-top:4px;
}
.k-sub:hover{background:var(--gold);}

/* ─── FOOTER ─── */
footer{
  background:#1a2535;padding:36px 80px;
  display:flex;align-items:center;justify-content:space-between;
  gap:20px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.05);
}
.ft-logo-img{height:24px;width:auto;display:block;}
.ft-copy{font-size:11px;color:rgba(255,255,255,.25);}
.ft-soc{display:flex;gap:8px;}
.ft-s{
  width:34px;height:34px;
  border:1px solid rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:center;
  font-size:11px;color:rgba(255,255,255,.35);
  text-decoration:none;transition:all .25s;
  font-family:'Cormorant',serif;letter-spacing:0;
}
.ft-s:hover{border-color:var(--gold);color:var(--gold);}

/* ─── MOBILE MENU ─── */
#mmenu{
  display:none;position:fixed;inset:0;z-index:750;
  background:var(--white);padding:80px 40px 40px;
  flex-direction:column;gap:28px;
}
#mmenu.open{display:flex;}
.mmenu-logo{height:26px;width:auto;display:block;margin-bottom:8px;}
#mmenu a{
  font-family:'Cormorant',serif;font-size:32px;font-weight:300;
  color:var(--ink);transition:color .2s;
}
#mmenu a:hover{color:var(--gold);}

/* ─── REVEAL ─── */
.rv{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease;}
.rv.in{opacity:1;transform:none;}
.rv.d1{transition-delay:.1s;}.rv.d2{transition-delay:.2s;}.rv.d3{transition-delay:.3s;}

/* ─── RESPONSIVE ─── */
@media(max-width:1100px){
  .pb-bento{grid-template-columns:repeat(6,1fr);}
  .pb-1{grid-column:1/4;}.pb-2{grid-column:4/7;}
  .pb-3{grid-column:1/3;}.pb-4{grid-column:3/5;}.pb-5{grid-column:5/7;}
}
@media(max-width:900px){
  .section{padding:70px 40px;}
  #intro{padding:32px 40px;gap:40px;flex-wrap:wrap;}
  .prod-bento{display:flex;flex-direction:column;}
  #katalogu{grid-template-columns:1fr;}
  .cat-right-panel{display:none;}
  #rreth{grid-template-columns:1fr;}
  .ab-body{padding:60px 40px;}
  .k-g{grid-template-columns:1fr;gap:48px;}
  .srv-g{grid-template-columns:1fr 1fr;}
  #partners{padding:40px;}
  footer{padding:28px 40px;}
  #nav{padding:0 24px;}
  .hero-content{padding:0 40px 60px;}
  .nav-center{display:none;}
  .hamburger{display:flex;}
}
@media(max-width:600px){
  .section{padding:60px 24px;}
  .hero-content{padding:0 24px 48px;}
  .srv-g{grid-template-columns:1fr;}
  .ab-feats{grid-template-columns:1fr;}
  .intro-stat-n{font-size:36px;}
  #intro{gap:20px;}
  .cat-left-panel{padding:50px 28px;}
  .ab-body{padding:48px 24px;}
  #partners{padding:32px 24px;gap:28px;}
  footer{padding:24px;}
  .cp-cg{grid-template-columns:1fr 1fr;}
  .c-thumbs{display:none;}
}
