
body {
  background-color: #fbfcf7;
  font-family: "Comfortaa", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
.graphic_1 {
  display: grid;
  container-type: inline-size;
  aspect-ratio: 4/1;
  border-radius: 0rem;
  color: #274e4f;
  background-color: #fff;
  border: 0.5px solid #2d6b22;
  gap: 1rem;
  margin-top: 20px;
  margin-bottom: 30px;
  font-family: "Comfortaa", serif;
  text-decoration: none;
  text-shadow: 6px 7px 9px rgba(61,61,52,0.42);
  --shadow: 
    -.5rem -.5rem 1rem hsl(0 0% 100% / .75),
    .5rem .5rem 1rem hsl(0 0% 50% / .5);
  box-shadow: var(--shadow);
  > h1 {
    font-size:4cqi;
    margin: auto;
    padding-top: 10px;
  }
  > img {
    margin: auto;
    padding: 10px;
    border: 0.5px solid #2d6b22;
    margin-bottom: 20px;
    text-shadow: 6px 7px 9px rgba(61,61,52,0.42);
  --shadow: 
    -.5rem -.5rem 1rem hsl(0 0% 100% / .75),
    .5rem .5rem 1rem hsl(0 0% 50% / .5);
  box-shadow: var(--shadow);
  }
}
.content_1 {
  display: grid;
  container-type: inline-size;
  aspect-ratio: 1/1;
  color: #274e4f;
  background-color: #fff;
  border: 0.5px solid #2d6b22;
  gap: 1rem;
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 30px;
  font-family: "Comfortaa", serif;
  text-decoration: none;
  text-shadow: 6px 7px 9px rgba(61,61,52,0.42);
  --shadow: 
    -.5rem -.5rem 1rem hsl(0 0% 100% / .75),
    .5rem .5rem 1rem hsl(0 0% 50% / .5);
  box-shadow: var(--shadow);
}
.neumorphic {
  display: grid;
  container-type: inline-size;
  aspect-ratio: 1/1;
  border: 0.5rem solid transparent;
  border-radius: 0.4rem;
  color: hsl(0 0% 10%);
  background-color: #fff;
  border: 0.5px solid #93bcbd;
  place-content: center;
  gap: 0.5rem;
  font-family: "Comfortaa", serif;
  text-decoration: none;
  --shadow: 
    -.5rem -.5rem 1rem hsl(0 0% 100% / .75),
    .5rem .5rem 1rem hsl(0 0% 50% / .5);
  box-shadow: var(--shadow);
  outline: none;  
  transition: all 0.8s;
  
  &:hover, &:focus-visible {
    color: #631902;
    scale: 1.04
  }
  &:active {
    box-shadow:
      var(--shadow),
      inset .5rem .5rem 1rem hsl(0 0% 50% / .5),
      inset -.5rem -.5rem 1rem hsl(0 0% 100% / .75);
    color: hsl(10 80% 50%);
    > span { font-size: 4cqi};
  }
  > span {
    font-size:8cqi;
    margin: auto;
    padding-bottom: 2px;
  }
  > img,
    svg
     {
    padding-top: 5PX;
    margin: auto;
  }
}
.buttons_1, 
.buttons_2 {
  display: grid;
  width: min(50rem, 100%);
  margin-inline: auto;
  column-gap: 2rem;
  row-gap: 0rem;
  
  > img,
    svg {
      position: relative;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
}
  .item_1 {
    grid-column: 1 / span 3;
    grid-row: 6 / span 2;
  }
  .item_2 {
    grid-column: 1 / span 3;
    grid-row: 2 / span 2;
  }
   .item_3 {
    grid-column: 1 / span 1;
    grid-row: 14 / span 1;
  }
   .item_4 {
     grid-column: 2 / span 1;
     grid-row: 14 / span 2;
  }
    .item_5 {
     grid-column: 3 / span 1;
     grid-row: 14 / span 2;
  }
/*ГАЛЕРІ*/
    .item_01 {
      grid-column: 1 / span 1;
      grid-row: 1 / span 1;
      margin: auto;   
       > img, 
         svg {
         position: relative;
          width: 90%;
         height: 90%;
         transition: all 0.8s;
         &:hover, &:focus-visible {
         scale: 1.1
         } 
        }
       }
    .item_02 {
      grid-column: 2 / span 1;
      grid-row: 1 / span 1;
      margin: auto;   
       > img, 
         svg {
         position: relative;
          width: 90%;
         height: 90%;
         transition: all 0.8s;
         &:hover, &:focus-visible {
         scale: 1.1
         } 
        }
       }
.item_03 {
  grid-column: 3 / span 1;
  grid-row: 1 / span 1;
  margin: auto;
       > img, 
         svg {
         position: relative;
          width: 90%;
         height: 90%;
         transition: all 0.8s;
         &:hover, &:focus-visible {
         scale: 1.1
         } 
        }
       }
.item_04 {
  grid-column: 1 / span 1;
  grid-row: 2 / span 1;
  margin: auto;
       > img, 
         svg {
         position: relative;
          width: 90%;
         height: 90%;
         transition: all 0.8s;
         &:hover, &:focus-visible {
         scale: 1.1
         } 
        }
       }
.item_05 {
    grid-column: 2 / span 1;
    grid-row: 2 / span 1;
    margin: auto;
       > img, 
         svg {
         position: relative;
          width: 90%;
         height: 90%;
         transition: all 0.8s;
         &:hover, &:focus-visible {
         scale: 1.1
         } 
        }
       }
    .item_06 {
      grid-column: 3 / span 1;
      grid-row: 2 / span 1;
      margin: auto;   
       > img, 
         svg {
         position: relative;
          width: 90%;
         height: 90%;
         transition: all 0.8s;
         &:hover, &:focus-visible {
         scale: 1.1
         } 
        }
       }
.item_07 {
  grid-column: 1 / span 1;
  grid-row: 3 / span 1;
  margin: auto;
       > img, 
         svg {
         position: relative;
          width: 90%;
         height: 90%;
         transition: all 0.8s;
         &:hover, &:focus-visible {
         scale: 1.1
         } 
        }
       }
.item_08 {
  grid-column: 2 / span 1;
  grid-row: 3 / span 1;
  margin: auto;
       > img, 
         svg {
         position: relative;
          width: 90%;
         height: 90%;
         transition: all 0.8s;
         &:hover, &:focus-visible {
         scale: 1.1
         } 
        }
       }
  .item_09 {
  grid-column: 3 / span 1;
  grid-row: 3 / span 1;
  margin: auto;
       > img, 
         svg {
         position: relative;
          width: 90%;
         height: 90%;
         transition: all 0.8s;
         &:hover, &:focus-visible {
         scale: 1.1
         } 
        }
       }
/*ГАЛЕРІ*/
/*телефони*/
.tel_blok_mess_1_1 {
  margin-top: 60px;
  margin-bottom: 50px;
  display: grid;
  width: min(50rem, 100%);
  margin-inline: auto;
  gap: 1rem;
}
  .item_6 {
    display: grid;
    grid-column: 1 / span 1;
    grid-row: 1 / span 1;
    margin: auto;
      > img, 
        svg {
      position: relative;
      width: 97%;
      height: 97%;
      object-fit: cover;
      margin: auto;
          border-radius: 10px;
      border: 0.5px solid #e8ede9;
      --shadow: 
      -.5rem -.5rem 1rem hsl(0 0% 100% / .75),
      .5rem .5rem 1rem hsl(0 0% 50% / .5);
       box-shadow: var(--shadow);
       outline: none;  
       transition: all 0.8s;
       &:hover, &:focus-visible {
       scale: 1.1
       } 
      }
     }
    .item_7 {
      grid-column: 2 / span 1;
      grid-row: 1 / span 1;
      margin: auto;   
       > img, 
         svg {
         position: relative;
         width: 100%;
         height: 100%;
         object-fit: cover;
         margin: auto;
         border-radius: 10px;
         border: 0.5px solid #e8ede9;
         --shadow: 
         -.5rem -.5rem 1rem hsl(0 0% 100% / .75),
         .5rem .5rem 1rem hsl(0 0% 50% / .5);
         box-shadow: var(--shadow);
         outline: none;  
         transition: all 0.8s;
         &:hover, &:focus-visible {
         scale: 1.1
         } 
        }
       }
.item_8 {
  grid-column: 3 / span 1;
  grid-row: 1 / span 1;
  margin: auto;
    > img, 
      svg {
      position: relative;
      width: 100%;
      height: 100%;
      object-fit: cover;
      margin: auto;
      border-radius: 10px;
      border: 0.5px solid #e8ede9;
      --shadow: 
      -.5rem -.5rem 1rem hsl(0 0% 100% / .75),
      .5rem .5rem 1rem hsl(0 0% 50% / .5);
       box-shadow: var(--shadow);
       outline: none;  
       transition: all 0.8s;
       &:hover, &:focus-visible {
       scale: 1.1
       } 
      }
     }
.item_9 {
  grid-column: 4 / span 1;
  grid-row: 1 / span 1;
  margin: auto;
    > img, 
      svg {
      position: relative;
      width: 100%;
      height: 100%;
      object-fit: cover;
      margin: auto;
      border-radius: 10px;
      border: 0.5px solid #e8ede9;
      --shadow: 
      -.5rem -.5rem 1rem hsl(0 0% 100% / .75),
      .5rem .5rem 1rem hsl(0 0% 50% / .5);
       box-shadow: var(--shadow);
       outline: none;  
       transition: all 0.8s;
       &:hover, &:focus-visible {
       scale: 1.1
       } 
      }
     }

/*телефони*/
