/*
 * Custom code goes here.
 */

/* hide firstname and lastname alerts in checkout form */  
#customer-form input[name="firstname"]+span.form-control-comment, #customer-form input[name="lastname"]+span.form-control-comment {
    display: none;
}
/* fix for Chrome image rendering */ 
img {
 image-rendering: -webkit-optimize-contrast;
} 


/* EDGAR  */


.edgar-section-title {
   text-align: center;
   margin-bottom: 1.5rem;
  
   span {
       color: #f52fac;
   }
}

.edgar-section-subtitle {
   text-align: center;
   color: #666;
   margin-bottom: 2rem;
}

/* Výhody sekce */
.advantages-section {
   width: 100%;
   max-width: 1400px;
   margin: 60px auto;
   padding: 20px;
   background: #f8f8f8;
   border-radius: 20px;
}

.advantages-grid {
   display: grid;
   grid-template-columns: repeat(5, 1fr);
   gap: 20px;
   padding: 20px 0;
}

.advantage-item {
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
}

.icon-wrapper {
   width: 45px;
   height: 45px;
   margin-bottom: 12px;
   display: flex;
   align-items: center;
   justify-content: center;
}

.icon-wrapper img {
   width: auto;
   height: 100%;
   object-fit: contain;
}

.advantage-title {
   font-family: 'Korolev', sans-serif;
   font-weight: 600;
   font-size: 20px;
   margin: 0 0 4px 0;
   color: #333;
}

.advantage-subtitle {
   font-size: 17px;
   color: #666;
   margin: 0;
   line-height: 1.3;
}

/* Media queries */
@media (max-width: 1200px) {
   .sport-card {
       flex: 0 0 160px;
   }
}

@media (max-width: 992px) {
   .advantages-grid {
       grid-template-columns: repeat(3, 1fr);
       gap: 15px;
   }
  
   .sport-card {
       flex: 0 0 150px;
   }
  
   .sports-categories-section {
       padding: 0 15px;
   }
}

@media (max-width: 768px) {
   .banner-grid {
       flex-wrap: wrap;
   }
  
   .banner-item {
       width: 48%;
       flex: 0 0 48%;
   }
  
   .sport-card {
       flex: 0 0 140px;
   }
}

@media (max-width: 576px) {
   .banner-container,
   .sports-categories-section {
       padding: 0 10px;
   }
  
   .banner-grid {
       gap: 10px;
   }
  
   .banner-item {
       width: 100%;
       flex: 0 0 100%;
   }
  
   .advantages-grid {
       grid-template-columns: repeat(2, 1fr);
       gap: 15px;
   }
  
   .sports-grid {
       gap: 10px;
   }
  
   .sport-card {
       flex: 0 0 calc(50% - 5px);
   }
  
   .sports-categories-section h1 {
       font-size: 24px;
       margin-bottom: 15px;
   }
}

h2 {
 font-style: italic;
}

.customer-reviews {
   max-width: 1200px;
   margin: 60px auto;
   padding: 0 20px;

   &__title {
       font-family: Arial, sans-serif;
       font-size: 2.5rem;
       color: #f52fac;
       text-align: center;
       margin-bottom: 40px;
       font-weight: 700;
   }

   &__grid {
       display: grid;
       grid-template-columns: repeat(3, 1fr);
       gap: 24px;
       margin-bottom: 30px;
   }

   &__card {
       background: #ffffff;
       padding: 24px;
       border-radius: 8px;
       box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
   }

   &__stars {
       margin-bottom: 16px;
       display: flex;
       gap: 2px;

       .star {
           color: #f52fac;
           font-size: 20px;
       }
   }

   &__date {
       color: #666;
       font-size: 14px;
       margin-bottom: 12px;
   }

   &__name {
       color: #333;
       font-size: 16px;
       font-weight: 600;
       margin-bottom: 12px;
   }

   &__text {
       color: #666;
       font-size: 15px;
       line-height: 1.5;
       margin: 0;
   }

   &__more {
       display: block;
       text-align: center;
       color: #f52fac;
       text-decoration: none;
       font-size: 16px;
       font-weight: 500;
       margin-top: 20px;

       &:hover {
           text-decoration: underline;
       }
   }

   @media (max-width: 992px) {
       &__grid {
           grid-template-columns: repeat(2, 1fr);
       }
   }

   @media (max-width: 576px) {
       padding: 0 15px;
      
       &__title {
           font-size: 2rem;
       }
      
       &__grid {
           grid-template-columns: 1fr;
       }

       &__card {
           padding: 20px;
       }
   }
}

.testimonials-section {
   max-width: 1200px;
   margin: -20px auto 60px;
   padding: 1rem;
}

.testimonials-title {
   font-size: 1.875rem;
   font-weight: 700;
   font-family: 'Korolev', sans-serif;
   font-weight: bold;
   font-style: italic;
   color: #f52fac;
   text-align: center;
   margin-bottom: 0.82rem;
}

.testimonials-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 2rem;
   padding: 1rem;
}

.testimonial-card {
   background: #fff;
   border-radius: 1rem;
   padding: 2rem;
   box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
   transition: transform 0.3s ease;
   position: relative;
}

.rating {
   margin-bottom: 1.5rem;
   display: flex;
   gap: 4px;
}

.star {
   color: #f52fac;
   font-size: 1.25rem;
}

.testimonial-content {
   display: flex;
   gap: 1.5rem;
   margin-bottom: 1.5rem;
}

.author-image {
   width: 100px;
   height: 100px;
   border-radius: 50%;
   overflow: hidden;
   flex-shrink: 0;
}

.author-image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.author-info {
   text-align: left;
}

.author-info h3 {
   color: #333;
   font-size: 1.1rem;
   font-weight: 600;
   margin: 0;
   margin-bottom: 0.5rem;
}

.author-info p {
   color: #f52fac;
   font-size: 0.9rem;
   margin: 0;
}

.testimonial-text {
   color: #666;
   font-size: 1rem;
   line-height: 1.6;
   text-align: justify;
}

.testimonial-text.collapsed {
   height: 4.8em;
   overflow: hidden;
}

.read-more-btn {
   background: none;
   border: none;
   color: #f52fac;
   font-size: 0.9rem;
   font-weight: 600;
   cursor: pointer;
   padding: 0;
   margin-top: 1rem;
   text-decoration: underline;
}

@media (max-width: 968px) {
   .testimonials-grid {
       grid-template-columns: repeat(2, 1fr);
   }
}

@media (max-width: 568px) {
   .testimonials-grid {
       grid-template-columns: 1fr;
   }
  
   .testimonials-title {
       font-size: 2.5rem;
   }
}



/* Edgar Landing Page Styles */
.edgar-wrapper {
  * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
  }

  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  line-height: 1.6;
  padding: 20px;
  max-width: 1200px;
  margin: 0 auto;

  /* Header a základní typografie */
  .edgar-header {
      margin-bottom: 2rem;
     
      h1 {
          color: #fa31b0;
          font-size: 2.5rem;
          font-weight: bold;
      }
  }

  /* Hlavní kontejner a flex layout */
  .edgar-container {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 2.5rem;
      margin-bottom: 2.5rem;

      .edgar-image-container {
          flex: 0 0 50%;
          max-width: 50%;
         
          img {
              width: 100%;
              height: auto;
              display: block;
              border-radius: 8px;
              object-fit: cover;
          }
      }

      .edgar-content {
          flex: 0 0 50%;
          max-width: 50%;
          padding: 2rem 0;
          display: flex;
          flex-direction: column;
          justify-content: center;

          h2 {
              color: #2c3e50;
              font-size: 1.75rem;
              margin-bottom: 1.5rem;
              font-weight: bold;
          }

          p {
              margin-bottom: 1.5rem;
              color: #2c3e50;
          }

          ul {
              list-style-type: disc;
              padding-left: 1.25rem;
              margin: 0;

              li {
                  margin-bottom: 0.75rem;
                  color: #2c3e50;
                 
                  &:last-child {
                      margin-bottom: 0;
                  }
              }
          }

          .edgar-cta-button {
              display: inline-block;
              background-color: #fa31b0;
              color: white;
              padding: 0.75rem 1.5rem;
              text-decoration: none;
              border-radius: 5px;
              font-weight: bold;
              margin-top: 1.25rem;
              transition: background-color 0.3s ease;

              &:hover {
                  background-color: darken(#fa31b0, 10%);
              }
          }
      }

      @media (max-width: 768px) {
          flex-direction: column;
         
          .edgar-image-container,
          .edgar-content {
              flex: 0 0 100%;
              max-width: 100%;
          }
      }
  }

  /* Benefits sekce */
.edgar-intro {
   text-align: center;
   margin-bottom: 3rem;
  
   h2 {
       font-size: 2rem;
       font-weight: bold;
       color: #2c3e50;
       margin-bottom: 1.5rem; 
   }
  
   p {
       font-size: 1.1rem;
       color: #666;
   }
}

.edgar-benefits {
display: flex;
justify-content: center;
align-items: flex-start;
gap: 2rem;
padding: 2rem 0;
}

.edgar-benefit-item {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
max-width: 20rem;
}

.edgar-icon {
margin-bottom: 1rem;
color: currentColor;
}

.edgar-benefit-title {
font-weight: 500;
}

/* Responzivní design */
@media (max-width: 1200px) {
   .edgar-benefits .benefits-grid {
       grid-template-columns: repeat(3, 1fr);
   }
}

@media (max-width: 900px) {
   .edgar-benefits .benefits-grid {
       grid-template-columns: repeat(2, 1fr);
   }
}

@media (max-width: 600px) {
   .edgar-benefits .benefits-grid {
       grid-template-columns: 1fr;
   }
  
   .edgar-benefits .benefit-card {
       max-width: 400px;
       margin: 0 auto;
   }
}

/*Kontaktni formular v produktu*/
.edgar-contact-v2 {
   max-width: 1200px;
   margin: 4rem auto;
   padding: 0 2rem;
  
   &__container {
       display: flex;
       gap: 4rem;
       background: #fff;
       border-radius: 16px;
       box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
       overflow: hidden;
   }
  
   &__left {
       flex: 0 0 45%;
       padding: 3rem;
       display: flex;
       flex-direction: column;
       gap: 2rem;
   }
  
   &__right {
       flex: 1;
       padding: 3rem;
       background: #fee1f4;
       display: flex;
       flex-direction: column;
       justify-content: center;
   }
  
   &__image {
       width: 180px;
       height: 180px;
       border-radius: 50%;
       margin-bottom: 2rem;
   }
  
   &__message {
       p {
           margin: 0;
           font-size: 1.1rem;
           line-height: 1.5;
           color: #2c3e50;
          
           &:first-child {
               font-size: 1.3rem;
               font-weight: 600;
               margin-bottom: 0.5rem;
           }
       }
   }
  
   &__mail, &__phone {
       display: flex;
       align-items: center;
       gap: 0.75rem;
       color: #f814a9;
       text-decoration: none;
       font-size: 1.1rem;
       font-weight: 500;
       transition: transform 0.2s ease;
      
       &:hover {
           transform: translateY(-2px);
       }
      
       svg {
           stroke-width: 2;
       }
   }
  
   &__hours {
       color: #666;
       font-size: 1rem;
      
       .hours-title {
           font-weight: 600;
           margin-bottom: 0.5rem;
           color: #2c3e50;
       }
      
       p {
           margin: 0;
           line-height: 1.5;
       }
   }
  
   &__form {
       h3 {
           font-size: 1.8rem;
           color: #2c3e50;
           margin-bottom: 2rem;
           font-style: italic;
           font-weight: 700;
           font-family: 'Korolev', sans-serif;
       }
      
       form {
           display: flex;
           flex-direction: column;
           gap: 1rem;
       }
   }
  
   &__input, &__textarea {
       width: 100%;
       padding: 1rem;
       border: 2px solid #fff;
       border-radius: 8px;
       font-size: 1rem;
       transition: border-color 0.2s ease;
      
       &:focus {
           outline: none;
           border-color: #f814a9;
       }
   }
  
   &__textarea {
       min-height: 120px;
       resize: vertical;
   }
  
   &__button {
       background: #f814a9;
       color: white;
       border: none;
       padding: 1rem 2rem;
       border-radius: 8px;
       font-size: 1rem;
       font-weight: 600;
       cursor: pointer;
       transition: transform 0.2s ease;
      
       &:hover {
           transform: translateY(-2px);
       }
   }
  
   .availability-dot {
       width: 8px;
       height: 8px;
       border-radius: 50%;
       display: inline-block;
   }
  
   @media (max-width: 992px) {
       &__container {
           flex-direction: column;
           gap: 0;
       }
      
       &__left, &__right {
           flex: 1;
           padding: 2rem;
       }
   }
  
   @media (max-width: 576px) {
       padding: 0 1rem;
      
       &__left, &__right {
           padding: 1.5rem;
       }
      
       &__form h3 {
           font-size: 1.5rem;
       }
      
       &__message p:first-child {
           font-size: 1.2rem;
       }
   }
}


  /* Nutriční tabulka */
  .edgar-nutrition {
      margin: 3rem 0;

      .edgar-nutrition-title {
          color: #2c3e50;
          font-size: 2rem;
          margin-bottom: 1rem;
      }

      .edgar-nutrition-subtitle {
          color: #666;
          margin-bottom: 2rem;
      }

      .edgar-nutrition-table {
          width: 100%;
          border-collapse: collapse;
          background: white;
          box-shadow: 0 2px 4px rgba(0,0,0,0.05);
         
          th {
              background: #fa31b0;
              color: white;
              padding: 1rem;
              text-align: left;
             
              &:not(:first-child) {
                  text-align: center;
              }

              &:nth-child(3) {
                  background: #fa31b0;
              }
          }
         
          td {
              padding: 1rem;
              border-bottom: 1px solid #eee;
             
              &:not(:first-child) {
                  text-align: center;
              }

              &:nth-child(3) {
                  background: #fce4ec;
              }
          }

          tr:nth-child(odd) td {
              background: #fef6f9;
             
              &:nth-child(3) {
                  background: #fce4ec;
              }
          }
      }

      @media (max-width: 768px) {
          .edgar-nutrition-table {
              font-size: 14px;
             
              th, td {
                  padding: 0.5rem;
              }
          }
      }
  }
}


.edgar-table {
   width: 100%;
   border-collapse: collapse;
   margin: 20px 0;
   border: 1px solid #eee;
  
   th, td {
       padding: 12px;
       text-align: left;
       border-bottom: 1px solid #eee;
   }
  
   th {
       background-color: #fa31b0;
       color: white;
       font-weight: bold;
       text-align: left;
      
       &:nth-child(3) {
           background-color: #fa31b0;
       }
   }
  
   td {
       &:nth-child(3) {
           background-color: #fce4ec;
       }
   }
  
   tr:nth-child(even) {
       background-color: #f9f9f9;
      
       td:nth-child(3) {
           background-color: #fce4ec;
       }
   }
  
   @media (max-width: 768px) {
       font-size: 14px;
      
       th, td {
           padding: 8px;
       }
   }
}

.edgar-nav {
   display: flex;
   justify-content: center;
   gap: 1rem;
   padding: 1rem;
   margin-bottom: 2rem;
   background: #f8f9fa;
   border-radius: 10px;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
  
   .edgar-nav-button {
       padding: 0.75rem 1.5rem;
       border: none;
       background: transparent;
       color: #2c3e50;
       font-weight: 500;
       cursor: pointer;
       border-radius: 5px;
       white-space: nowrap;
       transition: all 0.3s ease;
      
       &:hover {
           background: #e9ecef;
       }
      
       &.active {
           background: #fa31b0;
           color: white;
       }
   }

   @media (max-width: 768px) {
       gap: 0.5rem;
       padding: 0.75rem;
      
       .edgar-nav-button {
           padding: 0.5rem 1rem;
           font-size: 0.9rem;
       }
   }
}

.edgar-v2-combination {
   max-width: 1200px;
   margin: 4rem auto 2rem;
   padding: 0 2rem;

   @media (max-width: 576px) {
       padding: 0 1rem;
       margin: 2rem auto 1rem;
   }

   h2 {
       text-align: center;
       color: #2c3e50;
       font-size: 2.2rem;
       margin-bottom: 1.5rem;
       font-style: italic;

       @media (max-width: 576px) {
           font-size: 1.8rem;
           margin-bottom: 1rem;
       }
   }

   .edgar-v2-comparison-grid {
       display: grid;
       grid-template-columns: repeat(3, 1fr);
       gap: 2rem;

       @media (max-width: 992px) {
           grid-template-columns: repeat(2, 1fr);
           gap: 1.5rem;
       }

       @media (max-width: 576px) {
           grid-template-columns: 1fr;
           gap: 1rem;
       }
   }

   .edgar-v2-card {
       background: #f8f9fa;
       border-radius: 0.5rem;
       padding: 1.5rem;
       height: 400px;
       display: flex;
       flex-direction: column;

       @media (max-width: 576px) {
           height: auto;
           min-height: 350px;
           padding: 1rem;
       }

       h3 {
           color: #2c3e50;
           font-size: 1.1rem;
           font-weight: 500;
           height: 50px;
           margin: 0 0 1.5rem 0;
           text-align: center;
           display: flex;
           align-items: center;
           justify-content: center;

           a {
               color: inherit;
               text-decoration: none;
              
               &:hover {
                   color: #fa31b0;
               }
           }

           @media (max-width: 576px) {
               height: auto;
               min-height: 40px;
               margin-bottom: 1rem;
           }
       }

       .edgar-v2-features {
           flex: 1;
           margin-bottom: 1.5rem;

           @media (max-width: 576px) {
               margin-bottom: 1rem;
           }

           .feature {
               display: flex;
               align-items: flex-start;
               gap: 0.75rem;
               margin-bottom: 0.75rem;
               font-size: 0.9rem;
               line-height: 1.3;
               text-align: left;

               .icon {
                   width: 20px;
                   height: 20px;
                   display: flex;
                   align-items: center;
                   justify-content: center;
                   border-radius: 50%;
                   flex-shrink: 0;
               }

               &.positive .icon {
                   background: #fa31b0;
                   color: white;
               }

               span:not(.icon) {
                   color: #2c3e50;
               }

               @media (max-width: 576px) {
                   margin-bottom: 0.5rem;
                   font-size: 0.85rem;
               }
           }
       }

       .edgar-v2-image {
           height: 120px;
           display: flex;
           justify-content: center;
           align-items: center;
           padding-top: 1.5rem;
           border-top: 1px solid #eee;
          
           @media (max-width: 576px) {
               height: 100px;
               padding-top: 1rem;
           }
          
           img {
               height: 100px;
               width: auto;
               object-fit: contain;
               // Odstraněn grayscale filtr
               transition: transform 0.2s;

               &:hover {
                   transform: scale(1.05);
               }

               @media (max-width: 576px) {
                   height: 80px;
               }
           }
       }

       &:last-child {
           .edgar-v2-features {
               margin-bottom: 1rem;
           }

           .feature {
               margin-bottom: 0.5rem;
           }
       }
   }
}

.edgar-v2-comparison {
   max-width: 1200px;
   margin: 4rem auto 2rem;
   padding: 0 2rem;

   @media (max-width: 576px) {
       padding: 0 1rem;
       margin: 2rem auto 1rem;
   }

   h2 {
       text-align: center;
       color: #2c3e50;
       font-size: 2.2rem;
       margin-bottom: 1.5rem;
       font-style: italic;

       @media (max-width: 576px) {
           font-size: 1.8rem;
           margin-bottom: 1rem;
       }
   }

   .edgar-v2-comparison-grid {
       display: grid;
       grid-template-columns: repeat(4, 1fr);
       gap: 2rem;

       @media (max-width: 992px) {
           grid-template-columns: repeat(2, 1fr);
           gap: 1.5rem;
       }

       @media (max-width: 576px) {
           grid-template-columns: 1fr;
           gap: 1rem;
       }
   }

   .edgar-v2-card {
       background: #f8f9fa;
       border-radius: 0.5rem;
       padding: 1.5rem;
       height: 400px;
       display: flex;
       flex-direction: column;

       @media (max-width: 576px) {
           height: auto;
           min-height: 350px;
           padding: 1rem;
       }

       h3 {
           color: #2c3e50;
           font-size: 1.1rem;
           font-weight: 500;
           height: 50px;
           margin: 0 0 1.5rem 0;
           text-align: center;
           display: flex;
           align-items: center;
           justify-content: center;

           @media (max-width: 576px) {
               height: auto;
               min-height: 40px;
               margin-bottom: 1rem;
           }
       }

       .edgar-v2-features {
           flex: 1;
           margin-bottom: 1.5rem;

           @media (max-width: 576px) {
               margin-bottom: 1rem;
           }

           .feature {
               display: flex;
               align-items: flex-start;
               gap: 0.75rem;
               margin-bottom: 0.75rem;
               font-size: 0.9rem;
               line-height: 1.3;
               text-align: left;

               .icon {
                   width: 20px;
                   height: 20px;
                   display: flex;
                   align-items: center;
                   justify-content: center;
                   border-radius: 50%;
                   flex-shrink: 0;
               }

               &.positive .icon {
                   background: #fa31b0;
                   color: white;
               }

               &.negative .icon {
                   background: #718096;
                   color: white;
               }

               span:not(.icon) {
                   color: #2c3e50;
               }

               @media (max-width: 576px) {
                   margin-bottom: 0.5rem;
                   font-size: 0.85rem;
               }
           }
       }

       .edgar-v2-image {
           height: 120px;
           display: flex;
           justify-content: center;
           align-items: center;
           padding-top: 1.5rem;
           border-top: 1px solid #eee;
          
           @media (max-width: 576px) {
               height: 100px;
               padding-top: 1rem;
           }
          
           img {
               height: 100px;
               width: auto;
               object-fit: contain;
               filter: grayscale(1) brightness(0.7);

               @media (max-width: 576px) {
                   height: 80px;
               }
           }
       }

       &:first-child {
           .edgar-v2-image img {
               filter: none;
           }
       }

       &:last-child {
           .edgar-v2-features {
               margin-bottom: 1rem;
           }

           .feature {
               margin-bottom: 0.5rem;
           }
       }
   }
}


.edgar-comparison {
   padding: 2rem 0;
   max-width: 1200px;
   margin: 0 auto;

   h2 {
       text-align: center;
       color: #2c3e50;
       margin-bottom: 3rem;
       font-size: 2.2rem;
   }

   .edgar-comparison-grid {
       display: grid;
       grid-template-columns: repeat(4, 1fr);
       gap: 1rem;
       padding: 0 1rem;
   }

   .edgar-card {
       background: white;
       border-radius: 12px;
       padding: 1.5rem;
       box-shadow: 0 2px 8px rgba(0,0,0,0.05);
       display: flex;
       flex-direction: column;

       h3 {
           color: #2c3e50;
           text-align: center;
           margin-bottom: 1rem;
           padding-bottom: 0.5rem;
           border-bottom: 1px solid #eee;
           font-size: 1.1rem;
           min-height: 45px;
           display: flex;
           align-items: center;
           justify-content: center;
       }

       .edgar-features {
           margin-bottom: 1.5rem;
           flex-grow: 1;

           .feature {
               display: flex;
               align-items: flex-start;
               margin-bottom: 0.75rem;
               font-size: 0.9rem;
               line-height: 1.4;
              
               .icon {
                   width: 20px;
                   height: 20px;
                   display: flex;
                   align-items: center;
                   justify-content: center;
                   border-radius: 50%;
                   margin-right: 0.75rem;
                   margin-top: 2px;
                   flex-shrink: 0;
                   font-size: 0.8rem;
               }

               &.positive .icon {
                   background: #fa31b0;
                   color: white;
               }

               &.negative .icon {
                   background: #718096;
                   color: white;
               }

               span:not(.icon) {
                   color: #4a5568;
               }
           }
       }

       .edgar-image {
           height: 120px;
           display: flex;
           align-items: flex-end;
           justify-content: center;
           padding: 1rem;
           margin-top: auto;
          
           img {
               max-width: 80%;
               max-height: 100%;
               object-fit: contain;
               filter: grayscale(1) brightness(0.7);
           }
       }

       &:first-child .edgar-image img {
           filter: none;
       }
   }

   @media (max-width: 1200px) {
       .edgar-comparison-grid {
           grid-template-columns: repeat(2, 1fr);
       }
   }

   @media (max-width: 768px) {
       .edgar-comparison-grid {
           grid-template-columns: 1fr;
       }
      
       .edgar-card {
           margin-bottom: 1rem;
       }
   }
}

.edgar-dosage {
   margin-top: 2rem;
  
   .edgar-dosage-section {
       margin-bottom: 2rem;

       h3 {
           color: #2c3e50;
           font-size: 1.5rem;
           margin-bottom: 1rem;
           font-style: italic;
       }

       .edgar-dosage-grid {
           display: grid;
           grid-template-columns: repeat(3, 1fr);
           gap: 2rem;
           background: #f8f9fa;
           padding: 1.5rem;
           border-radius: 8px;
       }

       .edgar-dosage-column {
           h4 {
               color: #2c3e50;
               margin-bottom: 1rem;
               font-weight: bold;
           }

           .dosage-item {
               display: flex;
               align-items: center;
               margin-bottom: 0.75rem;
              
               .icon {
                   margin-right: 0.75rem;
                   width: 24px;
                   text-align: center;
               }
           }
       }

       p {
           font-size: 1rem;
           line-height: 1.6;
           color: #2c3e50;
       }

       ul {
           list-style-type: none;
           padding: 0;

           li {
               margin-bottom: 0.5rem;
               padding-left: 1.5rem;
               position: relative;

               &:before {
                   content: "•";
                   position: absolute;
                   left: 0;
                   color: #fa31b0;
               }
           }
       }
   }

   @media (max-width: 768px) {
       .edgar-dosage-grid {
           grid-template-columns: 1fr !important;
           gap: 1rem !important;
       }
   }
}

.edgar-wrapper {
   ul {
       list-style-type: none !important;
       padding-left: 1.25rem !important;
       margin: 0;
      
       li {
           margin-bottom: 0.75rem;
           padding-left: 1.5rem;
           position: relative;
           color: #2c3e50;

           &:before {
               content: "•";
               color: #fa31b0; // Růžová barva
               position: absolute;
               left: 0;
               font-size: 1.5rem;
               line-height: 1;
           }
       }
   }
}

  /* Benefits sekce */

.edgar-intro {
   text-align: center;
   max-width: 1200px;
   margin: 0 auto 2rem;
   padding: 0 1rem;
  
   h2 {
       color: #2c3e50;
       margin-bottom: 1rem;
       font-style: italic;
   }
  
   p {
       color: #666;
       margin-bottom: 1rem;
   }
}

.edgar-benefits {
   max-width: 1400px;
   margin: 0 auto;
   padding: 0 1rem;

   .benefits-grid {
       display: grid;
       grid-template-columns: repeat(4, 1fr);
       gap: 1rem;
   }

   .benefit-card {
       background: #eee;
       padding: 0.75rem;
       text-align: center;
      
       img {
           width: 45px; // O něco menší ikona
           height: 45px;
           object-fit: contain;
           margin-bottom: 0.1rem; // Extrémně malá mezera pod obrázkem
       }
      
       h3 {
           color: #2c3e50;
           font-size: 1.1rem;
           margin: 0 0 0.1rem 0; // Extrémně malá mezera pod nadpisem
           font-style: italic;
           line-height: 1;
           padding: 0;
       }
      
       p {
           color: #666;
           font-size: 0.9rem;
           line-height: 1.2;
           margin: 0;
           padding: 0;
       }
   }


   @media (max-width: 1200px) {
       .benefits-grid {
           grid-template-columns: repeat(2, 1fr);
       }
   }

   @media (max-width: 768px) {
       .benefits-grid {
           grid-template-columns: 1fr;
       }
   }
}


.edgar-nav {
   position: sticky;
   top: 55px;
   z-index: 200;
}

.edgar-about {
   background-color: #fee1f4;
   padding: 50px 0;
   color: #333;
   overflow: hidden;

   &__container {
       max-width: 1400px;
       margin: 0 auto;
       padding: 0 20px 0 40px;
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 60px;
       min-height: 400px;

       @media (max-width: 992px) {
           flex-direction: column;
           padding: 0 20px;
           gap: 40px;
           min-height: auto;
       }
   }

   &__content {
       flex: 0 1 50%;
       max-width: 600px;
       display: flex;
       align-items: center;
       min-height: 400px;

       @media (max-width: 992px) {
           text-align: center;
           flex: 1;
           min-height: auto;
       }
   }

   &__text-wrapper {
       width: 100%;
   }

   &__title {
       font-family: 'Korolev', sans-serif;
       font-size: 2.2rem;
       font-weight: 700;
       margin-bottom: 25px;
       font-style: italic;
       color: #f814a9;

       @media (max-width: 768px) {
           font-size: 2rem;
           margin-bottom: 20px;
       }
   }

   &__text {
       p {
           font-size: 1rem;
           line-height: 1.6;
           margin-bottom: 15px;

           &:last-child {
               margin-bottom: 0;
           }
       }
   }

   &__button {
       display: inline-block;
       background: #f814a9;
       color: white;
       text-decoration: none;
       padding: 12px 30px;
       border-radius: 100px;
       margin-top: 25px;
       font-weight: 500;
       font-size: 0.95rem;
       transition: transform 0.2s ease, box-shadow 0.2s ease;

       &:hover {
           transform: translateY(-2px);
           box-shadow: 0 4px 12px rgba(248, 20, 169, 0.2);
       }
   }

   &__timeline {
       flex: 1;
       max-width: 400px;
       opacity: 0;
       visibility: hidden;
      
       &.visible {
           opacity: 1;
           visibility: visible;

           .timeline__line:after {
               transform: scaleY(0);
           }

           .timeline__item {
               animation: fadeIn 0.5s ease forwards;
           }
       }

       @media (max-width: 992px) {
           max-width: 100%;
           margin: 0 auto;
       }
   }
}

.timeline {
   position: relative;
   z-index: 2;
   padding: 20px 0;

   @media (max-width: 992px) {
       max-width: 280px;
       margin: 0 auto;
   }

   &__items {
       position: relative;
       max-width: 360px;
       margin: 0 auto;
   }

   &__line {
       position: absolute;
       top: 0;
       bottom: 0;
       left: 50%;
       width: 3px;
       background: #f814a9;
       transform: translateX(-50%);

       @media (max-width: 992px) {
           left: 6px;
           transform: none;
       }

       &:after {
           content: '';
           position: absolute;
           top: 0;
           left: 0;
           width: 100%;
           height: 100%;
           background: #fee1f4;
           transform-origin: top;
           transform: scaleY(1);
           transition: transform 2s ease;
       }
   }

   &__item {
       position: relative;
       margin-bottom: 40px;
       width: 50%;
       opacity: 0;

       &:last-child {
           margin-bottom: 0;
       }

       &:nth-child(even) {
           margin-left: auto;

           .timeline__content {
               text-align: left;
               padding-left: 30px;
           }

           .timeline__dot {
               left: -6px;
           }
       }

       &:nth-child(odd) {
           .timeline__content {
               text-align: right;
               padding-right: 30px;
           }

           .timeline__dot {
               right: -6px;
           }
       }

       @media (max-width: 992px) {
           width: 100%;
           padding-left: 45px;
           margin-bottom: 60px;

           &:last-child {
               margin-bottom: 0;
           }

           &:nth-child(even),
           &:nth-child(odd) {
               margin-left: 0;

               .timeline__content {
                   text-align: left;
                   padding: 0;
               }

               .timeline__dot {
                   left: -45px;
                   right: auto;
               }
           }
       }

       @for $i from 1 through 4 {
           &:nth-child(#{$i}) {
               animation-delay: #{($i * 0.5) + 1}s;
           }
       }
   }

   &__content {
       position: relative;
       padding-top: 5px;

       @media (max-width: 992px) {
           padding-top: 0;
       }
   }

   &__year {
       font-size: 1.3rem;
       font-weight: 800;
       margin-bottom: 5px;
       color: #f814a9;

       @media (max-width: 992px) {
           font-size: 1.8rem;
           margin-bottom: 8px;
       }
   }

   &__dot {
       position: absolute;
       top: 8px;
       width: 12px;
       height: 12px;
       background: #f814a9;
       border-radius: 50%;
       z-index: 2;

       @media (max-width: 992px) {
           top: 6px;
           width: 14px;
           height: 14px;
       }
   }

   p {
       font-size: 0.9rem;
       margin: 0;
       font-weight: 300;
       color: #666;

       @media (max-width: 992px) {
           font-size: 1rem;
           color: #888;
       }
   }
}

@keyframes fadeIn {
   from {
       opacity: 0;
       transform: translateY(20px);
   }
   to {
       opacity: 1;
       transform: translateY(0);
   }
}

.edgar-contact {
   background-color: #fee1f4;
   padding: 60px 0;
  
   @media (max-width: 992px) {
       padding: 30px 0;
   }
  
   &__container {
       max-width: 1200px;
       margin: 0 auto;
       padding: 0 20px;
       display: flex;
       gap: 60px;
       justify-content: space-between;
       align-items: center;

       @media (max-width: 992px) {
           padding: 0 20px;
           flex-direction: column;
           align-items: center;
           gap: 0;
       }
   }

   &__left {
       flex: 0 1 500px;
       text-align: center;
      
       @media (max-width: 992px) {
           margin-bottom: -100px;
           position: relative;
           z-index: 1;
       }
   }

   &__mail {
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 15px;
       color: #333;
       text-decoration: none;
       font-size: 1.8rem;
       font-weight: 600;
       transition: color 0.2s ease;
       margin-bottom: 5px;

       svg {
           width: 32px;
           height: 32px;
           color: #333;
       }

       &:hover {
           color: #f814a9;
          
           svg {
               color: #f814a9;
           }
       }
   }

   &__message {
       margin: 0 0 40px;
      
       p {
           margin: 0;
           font-size: 1.1rem;
           line-height: 1.6;
           color: #333;
       }
   }

   &__phone {
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 15px;
       color: #333;
       text-decoration: none;
       font-size: 1.8rem;
       font-weight: 600;
       transition: color 0.2s ease;
       margin-bottom: 2px;
       margin-left: -35px;

       svg {
           width: 32px;
           height: 32px;
           color: #333;
           margin-left: -35px;
       }

       &:hover {
           color: #f814a9;
          
           svg {
               color: #f814a9;
           }
       }
   }

   &__hours {
       margin-top: 0;
      
       p {
           margin: 2px 0;
           color: #333;
           font-size: 1.1rem;
           font-weight: 400;
       }
   }

   &__right {
       flex: 0 1 500px;

       @media (max-width: 992px) {
           width: 100%;
           max-width: 500px;
           position: relative;
           z-index: 0;
       }
   }

   &__form {
       background: white;
       padding: 30px;
       border-radius: 20px;
       box-shadow: 0 10px 30px rgba(248, 20, 169, 0.1);

       @media (max-width: 992px) {
           transform: translateY(-40px);  // Nová úprava pro mobily
       }

       h3 {
           text-align: center;
           font-size: 1.8rem;
           color: #333;
           margin: 0 0 25px;
       }

       form {
           display: flex;
           flex-direction: column;
           gap: 15px;
       }
   }

   &__input {
       width: 100%;
       padding: 12px 15px;
       border: 2px solid rgba(248, 20, 169, 0.2);
       border-radius: 8px;
       font-size: 0.95rem;
       transition: border-color 0.2s ease;

       &:focus {
           outline: none;
           border-color: #f814a9;
       }
   }

   &__textarea {
       width: 100%;
       height: 120px;
       padding: 12px 15px;
       border: 2px solid rgba(248, 20, 169, 0.2);
       border-radius: 8px;
       font-size: 0.95rem;
       resize: none;
       transition: border-color 0.2s ease;

       &:focus {
           outline: none;
           border-color: #f814a9;
       }
   }

   &__button {
       width: 100%;
       background: #f814a9;
       color: white;
       border: none;
       padding: 12px;
       border-radius: 100px;
       font-weight: 500;
       font-size: 1rem;
       cursor: pointer;
       transition: transform 0.2s ease, box-shadow 0.2s ease;

       &:hover {
           transform: translateY(-2px);
           box-shadow: 0 4px 12px rgba(248, 20, 169, 0.2);
       }
   }
}

.availability-dot {
   display: inline-block;
   width: 8px;
   height: 8px;
   border-radius: 50%;
   margin-right: -5px;
}

.edgar-support {
   max-width: 800px;
   margin: 60px auto;
   background: white;
   border-radius: 12px;
   box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
   padding: 40px;
  
   &__container {
       display: flex;
       gap: 40px;
   }
  
   &__left {
       flex-shrink: 0;
   }
  
   &__image {
       width: 120px;
       height: 120px;
       border-radius: 50%;
   }
  
   &__right {
       flex: 1;
   }
  
   &__title {
       font-size: 32px;
       color: #333;
       margin: 0 0 15px 0;
       font-weight: normal;
       line-height: 1.2;
   }
  
   &__text {
       color: #666;
       font-size: 16px;
       line-height: 1.5;
       margin-bottom: 25px;
   }
  
   &__contact {
       display: flex;
       align-items: center;
       gap: 10px;
       color: #ff2fb9;
       text-decoration: none;
       font-size: 20px;
       margin-bottom: 5px;
      
       svg {
           width: 20px;
           height: 20px;
           flex-shrink: 0;
       }
   }
  
   &__availability {
       margin-left: 30px;
       margin-bottom: 20px;
       display: flex;
       align-items: center;
       gap: 8px;
       color: #666;
       font-size: 15px;
      
       .dot {
           width: 6px;
           height: 6px;
           border-radius: 50%;
          
           &.available {
               background-color: #22c55e;
           }
          
           &.unavailable {
               background-color: #ef4444;
           }
       }
   }
  
   @media (max-width: 768px) {
       margin: 30px 15px;
       padding: 30px;
      
       &__container {
           flex-direction: column;
           align-items: center;
           text-align: center;
           gap: 20px;
       }
      
       &__title {
           font-size: 28px;
       }
      
       &__contact {
           justify-content: center;
       }
      
       &__availability {
           margin-left: 0;
           justify-content: center;
       }
   }
}


.faq-section {
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 2rem;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
   margin-bottom: 0rem;
}

.faq-header {
   text-align: center;
   margin-bottom: 3rem;

   h2 {
       font-size: 2.5rem;
       color: #fa31b0;
       margin-bottom: 1rem;
   }

   p {
       color: #666;
       font-size: 1.1rem;
       max-width: 800px;
       margin: 0 auto;
   }
}

.faq-grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 1.25rem;
}

.faq-item {
   border-radius: 12px;
   overflow: hidden;
   margin-bottom: 1.5rem;
}

.faq-question {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 1.75rem 2rem;
   cursor: pointer;
   width: 100%;
   border: none;
   text-align: left;
   font-size: 1.1rem;
   color: #333;
   font-weight: 500;
   transition: all 0.25s ease;
   background: transparent;
   border: 1px solid #fa31b0;
   border-radius: 12px;

   &:hover {
       background: rgba(250, 49, 176, 0.05);
   }
}

.faq-icon {
   width: 24px;
   height: 24px;
   position: relative;
   transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

   &::before,
   &::after {
       content: '';
       position: absolute;
       background: #fa31b0;
       transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
   }

   &::before {
       top: 11px;
       left: 0;
       width: 24px;
       height: 2px;
   }

   &::after {
       top: 0;
       left: 11px;
       width: 2px;
       height: 24px;
   }
}

.faq-answer {
   max-height: 0;
   opacity: 0;
   overflow: hidden;
   transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
   padding: 0 2rem;
   color: #666;
   line-height: 1.6;
   font-size: 1.05rem;
   background: transparent;
   transform: translateY(-10px);
}

.faq-item.active {
   .faq-question {
       border-bottom-left-radius: 0;
       border-bottom-right-radius: 0;
       border-bottom: none;
   }

   .faq-answer {
       max-height: 300px;
       opacity: 1;
       padding: 2rem;
       border: 1px solid #fa31b0;
       border-top: none;
       border-bottom-left-radius: 12px;
       border-bottom-right-radius: 12px;
       background: #f8f9fa;
       transform: translateY(0);
   }

   .faq-icon::after {
       transform: rotate(90deg);
       opacity: 0;
   }
}

.edgar-ingredients {
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 2rem;


   .ingredients-grid {
       display: grid;
       grid-template-columns: repeat(2, 1fr);
       gap: 1.25rem;
   }

   .ingredient-item {
       border-radius: 12px;
       overflow: hidden;
       margin-bottom: 1.5rem;
   }

   .ingredient-question {
       display: flex;
       justify-content: space-between;
       align-items: center;
       padding: 1.75rem 2rem;
       cursor: pointer;
       width: 100%;
       border: none;
       text-align: left;
       font-size: 1.1rem;
       color: #333;
       font-weight: 500;
       transition: all 0.25s ease;
       background: transparent;
       border: 1px solid #fa31b0;
       border-radius: 12px;

       &:hover {
           background: rgba(250, 49, 176, 0.05);
       }
   }

   .ingredient-icon {
       width: 24px;
       height: 24px;
       position: relative;
       transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

       &::before,
       &::after {
           content: '';
           position: absolute;
           background: #fa31b0;
           transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
       }

       &::before {
           top: 11px;
           left: 0;
           width: 24px;
           height: 2px;
       }

       &::after {
           top: 0;
           left: 11px;
           width: 2px;
           height: 24px;
       }
   }

   .ingredient-answer {
       max-height: 0;
       opacity: 0;
       overflow: hidden;
       transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
       padding: 0 2rem;
       color: #666;
       line-height: 1.6;
       font-size: 1.05rem;
       background: transparent;
       transform: translateY(-10px);
   }

   .ingredient-item.active {
       .ingredient-question {
           border-bottom-left-radius: 0;
           border-bottom-right-radius: 0;
           border-bottom: none;
       }

       .ingredient-answer {
           max-height: none;
           opacity: 1;
           padding: 2rem;
           border: 1px solid #fa31b0;
           border-top: none;
           border-bottom-left-radius: 12px;
           border-bottom-right-radius: 12px;
           background: #f8f9fa;
           transform: translateY(0);
       }

       .ingredient-icon::after {
           transform: rotate(90deg);
           opacity: 0;
       }
   }
}


@media (max-width: 768px) {
   .faq-grid,
   .edgar-ingredients .ingredients-grid {
       grid-template-columns: 1fr;
       gap: 1rem;
   }
  
   .faq-header h2,
   .edgar-ingredients .edgar-ingredients-title h2 {
       font-size: 2rem;
   }
 }

   /* SCSS */
.trust-widget {
   background: white;
   border-radius: 12px;
   padding: 2rem;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
   max-width: 800px;
   margin: 2rem auto;

   &__header {
       margin-bottom: 2rem;
       text-align: center;

       &-content {
           display: inline-flex;
           align-items: center;
           gap: 1.5rem;
       }
   }

   &__badge {
       width: 60px;
       height: auto;
   }

   &__title {
       font-size: 1.5rem;
       font-weight: 600;
       color: #f52fac;
       margin-bottom: 0.5rem;
   }

   &__subtitle {
       color: #666;
       font-size: 1.1rem;
   }

   &__stats {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
       gap: 1.5rem;
       margin-bottom: 2rem;
       padding: 1.5rem;
       background: #f8f8f8;
       border-radius: 8px;
   }

   &__stat {
       text-align: center;
   }

   &__stat-number {
       font-size: 1.75rem;
       font-weight: 700;
       color: #f52fac;
       margin-bottom: 0.5rem;
   }

   &__stat-label {
       color: #666;
       font-size: 0.9rem;
   }

   &__review {
       background: #f8f8f8;
       padding: 1.5rem;
       border-radius: 8px;
       margin-bottom: 1.5rem;
   }

   &__stars {
       color: #f52fac;
       font-size: 1.2rem;
       margin-bottom: 1rem;
   }

   &__quote {
       font-size: 1.1rem;
       color: #333;
       line-height: 1.6;
       margin: 0 0 1rem 0;
       font-style: italic;
   }

   &__author {
       display: flex;
       align-items: center;
       gap: 1rem;
   }

   &__name {
       font-weight: 600;
       color: #333;
   }

   &__verified {
       color: #00b67a;
       font-size: 0.9rem;
       display: flex;
       align-items: center;
       gap: 0.25rem;
   }

   &__link {
       display: flex;
       align-items: center;
       justify-content: center;
       gap: 0.5rem;
       color: #f52fac;
       text-decoration: none;
       font-weight: 500;
       transition: color 0.2s;

       &:hover {
           color: darken(#f52fac, 10%);
       }

       svg {
           transition: transform 0.2s;
       }

       &:hover svg {
           transform: translateX(4px);
       }
   }
}

@media (max-width: 640px) {
   .trust-widget {
       padding: 1rem;

       &__header {
           flex-direction: column;
           text-align: center;
           gap: 1rem;
       }

       &__stats {
           grid-template-columns: 1fr;
           gap: 1rem;
       }
   }
}