:root {
--accent-color: #3d3bff;
--text-color: #222;
}
.bg-light-1{
background: linear-gradient(135deg,#7b6cff 0%, #b39dff 60%, #ffc2e2 100%);
}
.bg-light-2{
background: linear-gradient(135deg, #f6d365 0%, #fda085 100%);
}
.bg-light-3{
background: linear-gradient(135deg, #a1c4fd 0%, #c2e9fb 50%, #fbc2eb 100%);
}
.bg-light-4{
background: linear-gradient(135deg, #89f7fe 0%, #66a6ff 50%, #c3aed6 100%);
}
.bg-light-5{
background: linear-gradient(135deg, #fbc2eb 0%, #f6d365 100%);
}
.bg-light-6{
background: linear-gradient(135deg, #cfd9df 0%, #e2ebf0 40%, #f9d1d7 100%);
}
.bg-light-7{
background: linear-gradient(135deg, #d4fc79 0%, #96e6a1 100%);
}
.bg-light-8{
background: linear-gradient(135deg, #fad0c4 0%, #ffd1ff 100%);
}

.bg-light-9{
  background: linear-gradient(135deg,#7b6cff 0%, #b39dff 60%, #ffc2e2 100%);
}
.bg-light-10{
  background: linear-gradient(135deg, #f6d365 0%, #fda085 100%);
}
.bg-light-11{
  background: linear-gradient(135deg, #a1c4fd 0%, #c2e9fb 50%, #fbc2eb 100%);
}
.bg-light-12{
  background: linear-gradient(135deg, #89f7fe 0%, #66a6ff 50%, #c3aed6 100%);
}
.bg-light-13{
  background: linear-gradient(135deg, #fbc2eb 0%, #f6d365 100%);
}
.bg-light-14{
  background: linear-gradient(135deg, #cfd9df 0%, #e2ebf0 40%, #f9d1d7 100%);
}
.bg-light-15{
  background: linear-gradient(135deg, #d4fc79 0%, #96e6a1 100%);
}
.bg-light-16{
  background: linear-gradient(135deg, #fad0c4 0%, #ffd1ff 100%);
}


body {
background-color: #fff;
color: var(--text-color);
 font-family:  Graphik, Tahoma ,sans-serif;

}
 h1, h2, h3, h4, h5, h6{
	 font-weight: bold;
}

.navbar {
background-color: #fff;
border-bottom: 1px solid #eaeaea;
border-radius: 50px;
margin: 5px;
}
.navbar-brand {
font-weight: bold;
color: #3d3bff;
}
.nav-link.active {
color: #fff !important;
}
.nav-link:hover {
color: #3d3bff !important;
}
header {
  background: linear-gradient(
    135deg,
    #3d3bff 0%,        
    #8a89ff 50%,        
    #d6d5ff 100%);
color: #fff;
padding: 0;

margin: 5px;
}
.btn-accent {
background-color: #3d3bff;
color: #fff;
font-weight: 500;
border: none;
}
.btn-accent:hover {
background-color: #000;
color: #fff;
}
.card-title {
color: #3d3bff;
font-weight: bold;
}
footer {
background-color: #f8f8f8;
padding: 3rem 0;
border-top: 1px solid #eaeaea;
}
.footer-link {
color: #444;
text-decoration: none;
}
.footer-link:hover {
text-decoration: underline;
}
.skillbox_section{
border-radius: 32px;
}
/** бордер в бургер меню **/
.navbar-toggler {
padding: 0.5rem 0.75rem;
background-color: transparent;
border: none !important;
outline: none !important;
box-shadow: none !important;
}
/** стили для svg иконок в feedback **/
.rating-stars {
display: flex;
gap: 5px;
cursor: pointer;
}
.star {
width: 30px;
height: 30px;
fill: #ccc;
transition: fill 0.2s ease;
}
.star.hover {
fill: #f5d479; /* при наведении */
}
.star.active {
fill: #f5b301; /* выбранный рейтинг */
}


main img {
  border-radius: 35px;
}

.navbar .nav-item:hover{
  background-color: #fff;
  border-radius: 20px;

}
nav .nav-item{
  margin: 3px;
}

nav .dropdown-item:focus, .dropdown-item:hover {

  border-radius: 20px;
}







.skillbox_section img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* растянет изображение */
  display: block;    /* убирает лишние отступы */
  border-radius: 32px !important;
}
.skillbox_section .col-md-6.p-0 {
  padding: 0 !important; /* убирает боковые отступы */
}

.skillbox_section .container-fluid{
  padding-right: 0px;
}