@charset "utf-8";
/* CSS Document */


/* SHADOWS */
.shadow-strong {
  box-shadow: 2px 4px 20px rgba(0, 0, 0, 0.4); /* Stronger shadow */
}

.text-shadow {
  text-shadow: 2px 4px 12px rgba(0,0,0,0.6);
}
.text-shadow-small {
  text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}



/* SWIPER BUTTONS */
.btn-mehrentdecken {
  background-color: rgba(255, 255, 255, 0.1); /* halbtransparent weiß */
  color: rgba(255, 255, 255, 0.8);                               /* dunkle, gut lesbare Schrift */
  border: 1px solid rgba(255, 255, 255, 0.6);      /* sehr subtile Linie */
  border-radius: 7px;                          /* eckig */
  font-size: 0.70rem;                         /* kleine Typo */
  padding: 10px 20px;
  text-transform: uppercase;
  margin-top: 18px;
  transition: all 0.25s ease;                /* sanfte Übergänge */
}
/* Hover-Effekt */
.btn-mehrentdecken:hover {
  background-color: rgba(255, 255, 255, 0.2);/* hellgrau, fast opak */
  color: rgba(255, 255, 255, 1.0);                               /* schwarz für stärkeren Kontrast */
  border-color: rgba(255, 255, 255, 1.0);          /* etwas sichtbarer Rahmen */
}



/* BACKGROUNDS */
.bg-light-grey {
  background-color: #eeeeee;
}
.bg-pink {
  background: radial-gradient(
    circle at center,
    #e84393 0%,    /* bright core */
    #c23672 42%,   /* earlier transition */
    #6d214f 88%    /* darker edge comes sooner */
  );
  color: white;
}
.bg-grey-gradient {
  background: radial-gradient(
    circle at center,
    #ffffff 0%,    /* bright core */
    #eaeaea 32%,   /* earlier transition */
    #c8c8c8 88%    /* darker edge comes sooner */
  );
  color: white;
}


/* PARALLAX BACKGROUNDS */
.wildblumen-section {
  background-image: url("../images/backgrounds/wildblumen-4.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  background-attachment: fixed;   /* sorgt für den „Überflug“-Effekt */
  min-height: 55vh;              /* volle Höhe = sichtbarer Effekt */
}

.kerzengruppe-section {
  width: 100vw;
  min-height: 35vh;
  background-image: url("../images/backgrounds/kerzen-gruppe-1.jpg");
  background-repeat: no-repeat;
  background-position: center bottom;  /* oder center center */
  background-size: 100% auto;       /* immer volle Breite, Höhe proportional */
}



.linea-candelini,
.linea-brillini {
  position: relative;
  overflow: hidden;
}

.linea-candelini .hero-img {
  position: relative;
  left: 50%;
  transform: translateX(-50%) scale(1);
  transform-origin: top center; /* grow downward */
  will-change: transform;
  transition: transform 0.1s linear; /* small smoothing for scroll-time updates */
  display: block;
  height: auto;
  width: 160%; 
  max-width: none !important;
}
/* scale down as view grows; image stays centered */
@media (min-width: 300px)  { .linea-candelini .hero-img { width: 150%; } }
@media (min-width: 768px)  { .linea-candelini .hero-img { width: 130%; } }
@media (min-width: 992px)  { .linea-candelini .hero-img { width: 110%; } }
@media (min-width: 1200px) { .linea-candelini .hero-img { width: 90%; } }
@media (min-width: 1900px) { .linea-candelini .hero-img { width: 70%; } }

.linea-brillini .hero-img {
  position: relative;
  left: 50%;
  transform: translateX(-50%) scale(1);
  transform-origin: 50% 50%; 
  will-change: transform;
  transition: transform 0.1s linear; /* small smoothing for scroll-time updates */
  display: block;
  height: auto;
  max-width: none !important;
  width: 140%;
}
/* scale down as view grows; image stays centered */
@media (min-width: 300px)  { .linea-brillini .hero-img { width: 130%; } }
@media (min-width: 576px)  { .linea-brillini .hero-img { width: 120%; } }
@media (min-width: 768px)  { .linea-brillini .hero-img { width: 110%; } }
@media (min-width: 992px)  { .linea-brillini .hero-img { width: 100%; } }
@media (min-width: 1200px) { .linea-brillini .hero-img { width: 90%; } }
@media (min-width: 1900px) { .linea-brillini .hero-img { width: 70%; } }




/* SECTION Elements */
.section-headline-text {
  font-size:3.2rem;
  line-height:2.6rem;
}
.section-subline-text {
  font-size:1.7rem;
}
.section-h3-headline-text {
  font-size:2.8rem;
  line-height:2.4rem;
}
.section-h3-subline-text {
  font-size:1.5rem;
}
.section-button-mehr-entdecken {
  font-size:0.7rem;
  padding-left:20px;
  padding-right:20px;
  padding-top:10px;
  padding-bottom:10px;
}
@media (min-width: 576px)  {  }
@media (min-width: 768px)  {  }
@media (min-width: 992px)  {  }
@media (min-width: 1200px) {  }
@media (min-width: 1900px) { 
  .section-headline-text {
    font-size:3.6rem;
    line-height:2.8rem;
  } 
  .section-subline-text {
  font-size:2.0rem;
  }
}















/* NAVBAR */
:root {
  --navbar-height: 54px;
}
main {
  padding-top: var(--navbar-height);
}

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

/* LOGOS */
.younisono-logo {
    /* height: clamp(120px, 12vw, 120px); */
    height: 100px;
    width: auto;
    display: block;
}
.younisono-typo-logo {
    width: clamp(140px, 17vw, 160px);
    height: auto;
    display: block;
}

.custom-search-icon {
  transform: scale(0.8) !important;
}


/* TEXTS SETTINGS */
.text-anthrazit {
  color: rgb(75, 75, 75) !important; 
}





/* PRODUCT GROUPS */
.product-group-image {
  height: clamp(260px, 24vw, 350px); /* same height for both boxes */
  overflow: hidden;
  border-radius: 8px;
}

.product-group-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;  /* fill without distortion */
  display: block;
}








/* SWIPER Mainpage */
.swiper.fullscreen-swiper {
  width: 100%;
  height: calc(100vh - var(--navbar-height)); 
  position: relative;
  overflow: hidden;
}

.swiper-wrapper,
.swiper-slide,
.slide-content {
  width: 100%;
  height: 100%;
}

.slide-image {
  position: absolute;
  top: 0;
  left: 0;
  height:100%;
  width: 100%;
  z-index: 1;

  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  background-attachment: fixed;   /* sorgt für den „Überflug“-Effekt */
   /*min-height: 100vh;              volle Höhe = sichtbarer Effekt */
}

.slide-text {
  position: absolute;
  top: 11%;
  left: 4%;
  transform: translate(0, 0);
  z-index: 2;
  text-align: left; /* or center/right as needed */
  color: white;
}

/* Pfeile */
.swiper.fullscreen-swiper .swiper-button-next,
.swiper.fullscreen-swiper .swiper-button-prev {
  color: #8e8e8e !important; /* hellgrau */
  opacity: 0.3; 
  /* background-color: rgba(116, 116, 116, 0.25) !important; dunkleres Grau transparent 
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  padding-left:7px !important;
  padding-right:7px !important;
  border-radius: 8px !important;*/
  width: auto !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 10;
  transition: opacity 0.3s ease, color 0.3s ease;
}
.swiper.fullscreen-swiper .swiper-button-next:hover,
.swiper.fullscreen-swiper .swiper-button-prev:hover {
  /*background-color: rgba(136, 136, 136, 0.4) !important;  etwas heller beim Hover */
  color: #b9b9b9 !important; /* beim Hover etwas heller */
  transform: scale(1.0);
}

/* Pagination Dots */
.swiper.fullscreen-swiper .swiper-pagination-bullet {
  width: 9px !important;
  height: 9px !important;
  margin: 0 7px !important;
  background: #888888 !important; /* dunkler grau inaktiv */
  opacity: 1 !important;
  border-radius: 50% !important;
  transition: background-color 0.3s ease, transform 0.2s ease;
}

.swiper.fullscreen-swiper .swiper-pagination-bullet-active {
  background: #dcdcdc !important; /* hellgrau aktiv */
  transform: scale(1.0) !important;
}

.swiper-pagination {
  margin-bottom: 18px;
}

.swiper.fullscreen-swiper .swiper-scroll-down {
  position: absolute;
  bottom: 14px; /* place just below pagination */
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.7rem;          /* smaller, subtle */
  font-weight: 500;
  color: #a4a4a4;
  cursor: pointer;
  z-index: 11;
  transition: color 0.3s ease;
}

.swiper.fullscreen-swiper .swiper-scroll-down:hover {
  color: #ffffff;             /* brighter on hover */
  text-decoration: none; /* optional underline */
}








/* CAROUSEL */
/* 65% viewport height and cover */
#carouselCandelini{
  --carousel-h:65vh;
  display:flex;               /* stack inner + bottom bar */
  flex-direction:column;
}

#carouselCandelini .carousel-inner,
#carouselCandelini .carousel-item{
  height:var(--carousel-h);
}

#carouselCandelini .carousel-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

/* Bottom bar layout */
#carouselCandelini .carousel-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  margin-top:.75rem;
}

/* Move indicators below and center them */
#carouselCandelini .carousel-indicators{
  position:static;     /* no overlay */
  margin:0;            /* reset defaults */
}
#carouselCandelini .carousel-indicators .active {
  background-color: #333;   /* aktiver Punkt etwas heller/dunkler abheben */
}

/* Make default prev/next usable as inline buttons */
#carouselCandelini .carousel-control-prev,
#carouselCandelini .carousel-control-next{
  position:static;
  width:auto;
  opacity:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.25rem .5rem;
  background:black;
  color:black;
}

/* Optional: subtler icons */
#carouselCandelini .carousel-control-prev-icon,
#carouselCandelini .carousel-control-next-icon{
    filter: none;
}

/* Remove container side padding where the carousel sits */
.candelini-carousel-wrap{
  padding-left:0 !important;
  padding-right:0 !important;
  max-width:100% !important;
}

@media (prefers-reduced-motion: reduce){
  #carouselCandelini .carousel-item{ transition:none; }
}









/* Default (XS and down) */
.custom-navbar {
    min-height: 54px; /* default for xs */
    height: 54px;
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
    align-items: center;
}
:root {
    --navbar-height: 54px;
}
main {
    padding-top: var(--navbar-height);
}

.slide-text {
    position: absolute;
    top: 7%;
    left: 6%;
    transform: translate(0, 0);
    z-index: 2;
    text-align: left; /* or center/right as needed */
    color: white;
}
.slide-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 1;
    background-position: center;
}
/* Pfeile */
  .swiper.fullscreen-swiper .swiper-button-next,
  .swiper.fullscreen-swiper .swiper-button-prev {
    transform: scale(0.65);
    font-size:1.7rem;
  }
  .swiper.fullscreen-swiper .swiper-button-next:hover,
  .swiper.fullscreen-swiper .swiper-button-prev:hover {
    transform: scale(0.65);
  }

.younisono-headline-1 {
  font-size: 2.5rem;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}
.younisono-subline-1 {
  font-size: 1.4rem;
  margin-left:4px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}

.btn-mehrentdecken {
  font-size: 0.7rem;          /* smaller text */
  padding: 9px 20px;          /* 10px vertical padding, 20px horizontal */
  margin-top:15px;
}




/* Small (≥576px) */
@media (min-width: 576px) {
    .custom-navbar {
        min-height: 54px;
        height: 54px;
    }
    :root {
        --navbar-height: 54px;
    }
    main {
        padding-top: var(--navbar-height);
    }

    .slide-text {
        position: absolute;
        top: 19%;
        left: 11%;
        transform: translate(0, 0);
        z-index: 2;
        text-align: left; /* or center/right as needed */
        color: white;
    }
    /* Pfeile */
    .swiper.fullscreen-swiper .swiper-button-next,
    .swiper.fullscreen-swiper .swiper-button-prev {
      transform: scale(0.65);
      font-size:1.7rem;
    }
    .swiper.fullscreen-swiper .swiper-button-next:hover,
    .swiper.fullscreen-swiper .swiper-button-prev:hover {
      transform: scale(0.65);
    }

    .younisono-headline-1 {
      font-size: 3.0rem;
    }
    .younisono-subline-1 {
      font-size: 1.5rem;
      margin-left:4px;
    }
    .btn-mehrentdecken {
      font-size: 0.7rem;          /* smaller text */
      padding: 9px 20px;          /* 10px vertical padding, 20px horizontal */
      margin-top:20px;
    }
}

/* Medium (≥768px) */
@media (min-width: 768px) {
    .custom-navbar {
        min-height: 54px;
        height: 54px;
    }
    :root {
        --navbar-height: 54px;
    }
    main {
        padding-top: var(--navbar-height);
    }

    .slide-text {
        position: absolute;
        top: 15%;
        left: 11%;
        transform: translate(0, 0);
        z-index: 2;
        text-align: left; /* or center/right as needed */
        color: white;
    }
    /* Pfeile */
    .swiper.fullscreen-swiper .swiper-button-next,
    .swiper.fullscreen-swiper .swiper-button-prev {
      transform: scale(0.7);
      font-size:1.8rem;
    }
    .swiper.fullscreen-swiper .swiper-button-next:hover,
    .swiper.fullscreen-swiper .swiper-button-prev:hover {
      transform: scale(0.7);
    }

    .younisono-headline-1 {
      font-size: 3.0rem;
    }
    .younisono-subline-1 {
      font-size: 1.5rem;
      margin-left:4px;
    }
    .btn-mehrentdecken {
      font-size: 0.7rem;          /* smaller text */
      padding: 9px 20px;          /* 10px vertical padding, 20px horizontal */
      margin-top:25px;
    }
      
}

/* Large (≥992px) */
@media (min-width: 992px) {
    .custom-navbar {
        min-height: 56px;
        height: 56px;
    }
    :root {
        --navbar-height: 56px;
    }
    main {
        padding-top: var(--navbar-height);
    }

    .slide-text {
        position: absolute;
        top: 15%;
        left: 11%;
        transform: translate(0, 0);
        z-index: 2;
        text-align: left; /* or center/right as needed */
        color: white;
    }
    /* Pfeile */
    .swiper.fullscreen-swiper .swiper-button-next,
    .swiper.fullscreen-swiper .swiper-button-prev {
      transform: scale(0.8);
      font-size:2rem;
    }
    .swiper.fullscreen-swiper .swiper-button-next:hover,
    .swiper.fullscreen-swiper .swiper-button-prev:hover {
      transform: scale(0.8);
    }

    .younisono-headline-1 {
      font-size: 3.2rem;
    }
    .younisono-subline-1 {
      font-size: 1.6rem;
    }
    .btn-mehrentdecken {
      font-size: 0.77rem;
      padding: 12px 30px;
      margin-top: 28px;
    }
}

/* Extra Large (≥1200px) */
@media (min-width: 1200px) {
    .custom-navbar {
        min-height: 56px;
        height: 56px;
    }
    :root {
        --navbar-height: 56px;
    }
    main {
        padding-top: var(--navbar-height);
    }

    .slide-text {
        position: absolute;
        top: 19%;
        left: 15%;
        transform: translate(0, 0);
        z-index: 2;
        text-align: left; /* or center/right as needed */
        color: white;
    }
    /* Pfeile */
    .swiper.fullscreen-swiper .swiper-button-next,
    .swiper.fullscreen-swiper .swiper-button-prev {
      transform: scale(0.8);
      font-size:2rem;
    }
    .swiper.fullscreen-swiper .swiper-button-next:hover,
    .swiper.fullscreen-swiper .swiper-button-prev:hover {
      transform: scale(0.8);
    }

    .younisono-headline-1 {
      font-size: 3.2rem;
    }
    .younisono-subline-1 {
      font-size: 1.7rem;
    }

    .btn-mehrentdecken {
      font-size: 0.70rem;                         /* kleine Typo */
      padding: 14px 30px;
      margin-top: 40px;
    }
}




/* Optional: Remove default navbar-brand spacing */
.navbar-brand {
    margin: 0;
    padding: 0;
}
.navbar-toggler {
    border: none; /* Remove border */
    outline: none; /* Remove focus outline */
}
.navbar-toggler:focus, .navbar-toggler:active {
    outline: none; /* Additional focus outline removal */
    box-shadow: none; /* Remove box-shadow on focus and active */
}
.navbar-toggler-icon {
    transform: scale(1.00); /* Scale up by 25% */
    color:black;
}









/* BACKGROUND COLORS */
.younisono-navbar-bg { 
    background-color:white; 
  }

.younisono-main-view-bg { 
    background-color:white; 
  } 













/* FONTS local loaded */
@font-face {
  font-family: 'Agdasima';
  src: url('../fonts/Agdasima-Regular.ttf') format('truetype');
  font-weight: normal;
}
.font-agdasima {
  font-family: 'Agdasima', sans-serif;
  font-weight: normal;
}
@font-face {
  font-family: 'Agdasima';
  src: url('../fonts/Agdasima-Bold.ttf') format('truetype');
  font-weight: bold;
}
.font-agdasima-bold {
  font-family: 'Agdasima', sans-serif;
  font-weight: bold;
}
@font-face {
  font-family: 'Marvel';
  src: url('../fonts/Marvel-Regular.ttf') format('truetype');
  font-weight: normal;
}
.font-marvel {
  font-family: 'Marvel', sans-serif;
  font-weight: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga", "kern";
}
@font-face {
  font-family: 'Marvel';
  src: url('../fonts/Marvel-Bold.ttf') format('truetype');
  font-weight: bold;
}
.font-marvel-bold {
  font-family: 'Marvel', sans-serif;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga", "kern";
}

/* BARLOW FONT  */
/* Barlow Semi Condensed - Extra Light */
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed-ExtraLight.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed-ExtraLightItalic.ttf') format('truetype');
  font-weight: 200;
  font-style: italic;
}
/* Barlow Semi Condensed - Light */
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}
/* Barlow Semi Condensed - Regular */
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
/* Barlow Semi Condensed - Regular Italic */
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
}
/* Barlow Semi Condensed - Bold */
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
}
/* Barlow Semi Condensed - Extra Bold */
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed-ExtraBoldItalic.ttf') format('truetype');
  font-weight: 800;
  font-style: italic;
}
/* Barlow Semi Condensed - Black */
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: 'BarlowSemiCondensed';
  src: url('../fonts/BarlowSemiCondensed-BlackItalic.ttf') format('truetype');
  font-weight: 900;
  font-style: italic;
}
/* Optional helper classes */
.font-barlow-thin {
  font-family: 'BarlowSemiCondensed', sans-serif;
  font-weight: 200;
}
.font-barlow-light {
  font-family: 'BarlowSemiCondensed', sans-serif;
  font-weight: 300;
}
.font-barlow-regular {
  font-family: 'BarlowSemiCondensed', sans-serif;
  font-weight: 400;
}
.font-barlow-bold {
  font-family: 'BarlowSemiCondensed', sans-serif;
  font-weight: 700;
}
.font-barlow-extrabold {
  font-family: 'BarlowSemiCondensed', sans-serif;
  font-weight: 800;
}
.font-barlow-black {
  font-family: 'BarlowSemiCondensed', sans-serif;
  font-weight: 900;
}


/* GLORY FONT COMPLETE SET */

/* Thin (100) */
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-Thin.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-ThinItalic.ttf') format('truetype');
  font-weight: 100;
  font-style: italic;
}

/* ExtraLight (200) */
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-ExtraLight.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-ExtraLightItalic.ttf') format('truetype');
  font-weight: 200;
  font-style: italic;
}

/* Light (300) */
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display:swap;
}
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  font-display:swap;
}

/* Regular (400) */
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
}

/* Medium (500) */
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
}

/* SemiBold (600) */
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-SemiBoldItalic.ttf') format('truetype');
  font-weight: 600;
  font-style: italic;
}

/* Bold (700) */
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
}

/* ExtraBold (800) */
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: 'glory';
  src: url('../fonts/Glory-ExtraBoldItalic.ttf') format('truetype');
  font-weight: 800;
  font-style: italic;
}

/* ===== Glory utilities (plain CSS, with antialiasing) ===== */

/* Thin (100) */
.font-glory-thin {
  font-family: 'glory', sans-serif; font-weight: 100; font-style: normal;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}
.font-glory-thin-italic {
  font-family: 'glory', sans-serif; font-weight: 100; font-style: italic;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}

/* ExtraLight (200) */
.font-glory-extra-light {
  font-family: 'glory', sans-serif; font-weight: 200; font-style: normal;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}
.font-glory-extra-light-italic {
  font-family: 'glory', sans-serif; font-weight: 200; font-style: italic;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}

/* Light (300) */
.font-glory-light {
  font-family: 'glory', sans-serif; 
  font-weight: 300; 
  font-style: normal;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}
.font-glory-light-italic {
  font-family: 'glory', sans-serif; font-weight: 300; font-style: italic;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}

/* Regular (400) */
.font-glory-regular {
  font-family: 'glory', sans-serif; font-weight: 400; font-style: normal;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}
.font-glory-italic {
  font-family: 'glory', sans-serif; font-weight: 400; font-style: italic;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}

/* Medium (500) */
.font-glory-medium {
  font-family: 'glory', sans-serif; font-weight: 500; font-style: normal;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}
.font-glory-medium-italic {
  font-family: 'glory', sans-serif; font-weight: 500; font-style: italic;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}

/* SemiBold (600) */
.font-glory-semibold {
  font-family: 'glory', sans-serif; font-weight: 600; font-style: normal;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}
.font-glory-semibold-italic {
  font-family: 'glory', sans-serif; font-weight: 600; font-style: italic;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}

/* Bold (700) */
.font-glory-bold {
  font-family: 'glory', sans-serif; font-weight: 700; font-style: normal;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}
.font-glory-bold-italic {
  font-family: 'glory', sans-serif; font-weight: 700; font-style: italic;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}

/* ExtraBold (800) */
.font-glory-extra-bold {
  font-family: 'glory', sans-serif; font-weight: 800; font-style: normal;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}
.font-glory-extra-bold-italic {
  font-family: 'glory', sans-serif; font-weight: 800; font-style: italic;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "liga", "kern";
}