/* =========================================================
   Amita Free — overrides (loaded last, wins over inline CSS)
   ========================================================= */

/* ---- OMICA font (used for TITLES / HEADINGS only) ---- */
@font-face {
  font-family: 'Omica';
  src: url('style/fonts/Omica/Omica.woff2') format('woff2'),
       url('style/fonts/Omica/Omica.woff')  format('woff'),
       url('style/fonts/Omica/Omica.ttf')   format('truetype'),
       url('style/fonts/Omica/Omica.otf')   format('opentype');
  font-weight: 400 700;   /* single weight file covers normal + bold */
  font-style: normal;
  font-display: swap;
}

/* Apply Omica to headings / titles only */
h1, h2, h3, h4, h5, h6,
#shija-kryesore h3, #shija-kryesore h5,
#info h3,
.pack-label,
#footer h4 {
  font-family: 'Omica', 'Proxima Nova', 'Segoe UI', Arial, sans-serif !important;
}

/* Body / content text: clean, readable sans (NOT the decorative SummerFont) */
body,
p, li, small, label, blockquote, td, th,
.card, .tab-content, .sasia, .sasia span, .barkod-1, .barkod-2,
.copyright, .overlay a,
input, textarea, select, button {
  font-family: 'Proxima Nova', 'Segoe UI', Roboto, Arial, sans-serif !important;
}

/* ---- Navbar: proper spacing so items never overlap ---- */
.nav-pc,
.nav-tel {
  align-items: center !important;
}
.nav-pc {
  padding-right: 4% !important;
}
.nav-pc .navbar-nav {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
}
.nav-pc .navbar-nav {
  flex-wrap: nowrap !important;
}
.nav-pc .navbar-nav .nav-item {
  width: auto !important;      /* override the fixed 120px from style.css */
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
}
.nav-pc .navbar-nav .nav-link {
  width: auto !important;
  padding: 6px 0 !important;
  margin: 0 20px !important;
  font-size: 18px !important;   /* smaller navbar text */
  white-space: nowrap !important;
}
.nav-pc .navbar-nav .nav-item:last-child .nav-link {
  margin-right: 0 !important;
}

/* ---- Flavor detail page: keep the tall HQ bottle inside its card ---- */
#shija-kryesore .amita-free-1 {
  display: flex;
  align-items: center;
  justify-content: center;
}
#shija-kryesore .amita-free-1 img {
  width: auto !important;
  height: auto !important;
  max-height: 480px !important;
  max-width: 100% !important;
}

/* Featured area: show 1L (behind) + 330ml (in front), overlapping */
#shija-kryesore .amita-free-1 .pack-pair-detail {
  position: relative;
  display: inline-block;
  padding-right: 42px;   /* room for the 330ml sticking out */
}
#shija-kryesore .amita-free-1 .pack-pair-detail .pack-1l {
  position: relative;
  z-index: 1;
  height: 420px !important;
  width: auto !important;
  max-height: none !important;
  max-width: none !important;
  display: block;
}
#shija-kryesore .amita-free-1 .pack-pair-detail .pack-330 {
  position: absolute;
  right: -8px;
  bottom: 0;
  z-index: 2;                 /* 330ml in FRONT */
  height: 275px !important;
  width: auto !important;
  max-height: none !important;
  max-width: none !important;
  filter: drop-shadow(0 14px 20px rgba(60, 70, 55, 0.28));
}
@media (max-width: 991px) {
  #shija-kryesore .amita-free-1 .pack-pair-detail .pack-1l { height: 320px !important; }
  #shija-kryesore .amita-free-1 .pack-pair-detail .pack-330 { height: 210px !important; }
}
.nav-pc .navbar-brand {
  display: flex;
  align-items: center;
  margin: 0 !important;
  padding: 0 !important;
}
.nav-pc .navbar-brand .logo,
.nav-pc .logo {
  width: 82px !important;
  height: auto !important;
  margin: 0 !important;
}
.nav-tel .logo {
  width: 66px !important;
  height: auto !important;
  margin: 0 !important;
}
/* keep the logo small & tidy when the navbar turns solid on scroll */
.navbar.scrolled {
  height: auto !important;
  margin: 0 !important;
  padding: 0.6% 10% !important;
}
.navbar.scrolled .logo {
  width: 72px !important;
  margin-bottom: 0 !important;
}
.nav-tel.scrolled {
  height: auto !important;
  padding: 3% 5% !important;
}

/* ---- Hero slider note: force wrap to 2-3 lines (LayerSlider ignores inline width) ---- */
#slider .hero-note {
  width: 300px !important;
  max-width: 300px !important;
  white-space: normal !important;
  word-wrap: break-word;
}

/* ---- Product showcase: 1L behind + 330ml in front (overlapping) ---- */
#produktet-pc {
  display: block;
  padding: 2% 0 5% 0;
}
#produktet-pc .pack-row {
  margin-top: 2.5%;
}
.pack-pair-link {
  display: inline-block;
  text-decoration: none !important;
}
.pack-pair {
  position: relative;
  display: inline-block;
  padding-right: 46px; /* room for the 330ml sticking out on the right */
}
.pack-pair .pack-1l {
  position: relative;
  z-index: 1;
  height: 370px;
  width: auto;
  display: block;
  transition: transform .35s ease;
}
.pack-pair .pack-330 {
  position: absolute;
  right: -6px;
  bottom: 0;
  z-index: 2;                 /* 330ml in FRONT of the 1L */
  height: 248px;
  width: auto;
  filter: drop-shadow(0 14px 20px rgba(60, 70, 55, 0.28));
  transition: transform .35s ease;
}
.pack-pair-link:hover .pack-1l { transform: translateY(-8px); }
.pack-pair-link:hover .pack-330 { transform: translateY(-3px); }
.pack-label {
  display: block;
  margin-top: 26px;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: 2px;
  color: #199A4C;
}

@media (max-width: 1366px) {
  .pack-pair .pack-1l { height: 320px; }
  .pack-pair .pack-330 { height: 214px; }
}