
/* =====================================================
   BASE & TYPO
===================================================== */

@font-face{
  font-family:"skriptni_font";
  src:url("../fonts/skriptni_font.woff2") format("woff2"),
      url("../fonts/skriptni_font.woff") format("woff");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"skriptni_font";
  src:url("../fonts/skriptni_font-italic.woff2") format("woff2"),
      url("../fonts/skriptni_font-italic.woff") format("woff");
  font-weight:400;
  font-style:italic;
  font-display:swap;
}

body{
  font-family:"DM Sans",sans-serif;
  background:#0d0d0f;
  color:#fff;
}

/* =====================================================
   SCRIPT FONT VARIANTS
===================================================== */

.skriptni_font,
.skriptni_font_crna,
.skriptni_font_hero,
.wine_caption_sivo,
.wine_caption_bijelo{
  font-family:"skriptni_font",serif;
  font-weight:400;
  letter-spacing:1px;
}

.skriptni_font{ font-size:100px;color:#fff;}
.skriptni_font_hero{ font-size:150px;color:#fff;}
.skriptni_font_crna{ font-size:100px;color:#000;}
.wine_caption_sivo{ font-size:102px;color:#757575;}
.wine_caption_bijelo{ font-size:102px;color:#fff;}

/* =====================================================
   GARABOND HEADINGS
===================================================== */

.garamond-h1,
.garamond-h2,
.garamond-h3{
  font-family:"EB Garamond",serif;
  font-weight:500;
  line-height:1.2;
  color:#fff;
  margin-bottom:20px;
}

.garamond-h1{font-size:64px;}
.garamond-h2{font-size:42px;}
.garamond-h3{font-size:28px;}

/* =====================================================
   HERO
===================================================== */

.home-section{position:relative;overflow:hidden;}

.logo-img{
  width:200px;
  height:auto;
}

/* =====================================================
   SECTIONS
===================================================== */

.after-hero-section{
  background:#111;
  position:relative;
}

/* =====================================================
   LEFT DARK GRADIENT OVER IMAGE
===================================================== */

.df-left-gradient{
  position:relative;
  overflow:hidden;
}

.df-left-gradient::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    90deg,
    rgba(0,0,0,.92) 0%,
    rgba(0,0,0,.85) 25%,
    rgba(0,0,0,.65) 45%,
    rgba(0,0,0,.35) 65%,
    rgba(0,0,0,0) 85%
  );
  z-index:1;
}

.df-left-gradient .container{
  position:relative;
  z-index:2;
}

/* =====================================================
   TITLE DECOR LINE
===================================================== */

.df-title-line{
  position:relative;
  display:inline-block;
  padding-bottom:8px;
}

.df-title-line::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:12px;
  width:125%;
  height:60px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 60'%3E%3Cpath d='M0 32 C120 28 240 38 360 32 C480 26 540 34 600 32' fill='none' stroke='%23777777' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center;
  background-size:100% 100%;
  opacity:.6;
}

/* =====================================================
   BUTTONS
===================================================== */

.btn-korten{
  display:inline-block;
  padding:14px 34px;
  font-size:13px;
  font-weight:600;
  letter-spacing:1.5px;
  text-transform:uppercase;
  border-radius:4px;
  color:#f3eee9;
  text-decoration:none;
  background:linear-gradient(135deg,#2c140e,#a24a27,#2a120c);
  border:1px solid #5e2c17;
  transition:.3s ease;
}

.btn-korten:hover{
  transform:translateY(-2px);
}

.btn-blackgrad{
  display:inline-block;
  padding:14px 34px;
  font-size:13px;
  font-weight:600;
  letter-spacing:2px;
  color:#fff;
  text-decoration:none;
  background:linear-gradient(180deg,#0a0a0b,#1b1b1f);
  border:1px solid rgba(255,255,255,.12);
  transition:.3s ease;
}

.btn-blackgrad:hover{
  transform:translateY(-2px);
}

/* =====================================================
   WINES SECTION
===================================================== */

.df-wines-section{
  background:radial-gradient(120% 140% at 50% 0%,#000 0%,#16171b 100%);
  padding:100px 0;
}

.df-wines-head{
  text-align:center;
  margin-bottom:50px;
}

.df-wines-wrap{
  width:100vw;
  margin-left:calc(50% - 50vw);
}

.df-wine-item{padding:20px;}

.df-wine-card{
  text-align:center;
  transition:.35s ease;
}

.df-wine-card:hover{
  transform:translateY(-8px);
}

.df-wine-title{
  font-size:26px;
  font-weight:300;
  margin-bottom:20px;
  color:rgba(255,255,255,.85);
}

.df-wine-media{
  height:480px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  margin-bottom:20px;
  position:relative;
}

.df-wine-media img{
  height:100%;
  width:auto;
  object-fit:contain;
  filter:drop-shadow(0 20px 25px rgba(0,0,0,.4));
}

/* =====================================================
   OWL NAV FIX (STRELICe VIDLJIVE)
===================================================== */

.df-wines-slider .owl-nav{
  display:block !important;
  position:absolute;
  top:50%;
  left:0;
  right:0;
  transform:translateY(-50%);
  z-index:9999;
  pointer-events:none;
}

.df-wines-slider .owl-nav button{
  pointer-events:auto;
  position:absolute;
  width:60px;
  height:60px;
  border-radius:50%;
  background:rgba(0,0,0,.75) !important;
  border:1px solid rgba(255,255,255,.25) !important;
  backdrop-filter:blur(6px);
}

.df-wines-slider .owl-nav .owl-prev{left:20px;}
.df-wines-slider .owl-nav .owl-next{right:20px;}

.df-wines-slider .owl-nav button span{
  color:#fff;
  font-size:36px;
  line-height:60px;
}

.df-wines-slider .owl-nav button:hover{
  background:rgba(0,0,0,.9) !important;
}

/* =====================================================
   RESPONSIVE
===================================================== */

@media(max-width:992px){
  .df-wine-media{height:380px;}
  .skriptni_font_hero{font-size:80px;}
  .garamond-h2{font-size:30px;}
  .skriptni_font{ font-size:80px;color:#fff;}
}

@media(max-width:576px){
  .skriptni_font_hero{font-size:80px;}
  .garamond-h2{font-size:30px;}
  .df-wine-media{height:260px;}
  .df-wines-slider .owl-nav button{
    width:46px;
    height:46px;
  }
}


/* Ne forsiraj uppercase na skriptni naslov */
.section-caption.skriptni_font{
  text-transform: none !important;
}




/* Gallery image fix */
.post-prev-img{
  height:350px;
  overflow:hidden;
}

.post-prev-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
