 :root {
     --accent-pink: #fb718b;
     --accent-blue: #2497b9;
     --light-pink: #fff5f7;
     --light-blue: #f0f9fb;
 }

img {
    max-width: 100%
}

.fl {
    display: flex;
}

.jsb {
    justify-content: space-between
}

.ac {
    align-items: center
}

.jc {
    justify-content: center
}

.mob {
    display: none;
}


 body {
     font-family: 'Manrope', sans-serif;
     color: #000;
     background-color: #fff;
 
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
     font-family: 'Manrope', sans-serif;
     font-weight: 700;
 }

/*ANIMATE*/

[data-animate] {
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.8s ease-out;
    will-change: opacity, transform;
}


[data-animate].animated {
    opacity: 1;
    transform: translateY(0);
}

/* Fade Up */
[data-animate="fade-up"].animated {
    transform: translateY(0);
}

/* Fade Left */
[data-animate="fade-left"] {
    transform: translateX(100px);
}

[data-animate="fade-left"].animated {
    transform: translateX(0);
}

/* Fade Right */
[data-animate="fade-right"] {
    transform: translateX(-100px);
}

[data-animate="fade-right"].animated {
    transform: translateX(0);
}

/* Zoom In */
[data-animate="zoom-in"] {
    transform: scale(0.8);
}

[data-animate="zoom-in"].animated {
    transform: scale(1);
}

/* Flip */
[data-animate="flip"] {
    transform: perspective(1000px) rotateX(90deg);
}

[data-animate="flip"].animated {
    transform: perspective(1000px) rotateX(0);
}

/* Bounce */
[data-animate="bounce"] {
    transform: translateY(100px);
}

[data-animate="bounce"].animated {
    transform: translateY(0);
    animation: bounce 0.6s ease-out;
}

@keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-30px);
    }

    60% {
        transform: translateY(-15px);
    }
}

/* Custom delay and duration */
[data-animate] {
    transition-duration: var(--duration, 800ms);
    transition-delay: var(--delay, 0ms);
}







 /* Фиксированная шапка */
 .navbar {
     background-color: #fff;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
     padding: 15px 0;
     transition: all 0.3s ease;
 }

 .navbar-brand img {
     max-height: 380px;
     /* border-radius: 50%; */
     max-width: 100%;
     border-radius: 15px;
     object-fit: cover;
     width: 100%;
 }

.social-icons {
    display: flex;
    margin-left: 30px;
    line-height: 1;
}

header .social-icons {
    margin-left:50px
}

.d-flex.header-right {
    background: #f6e2df;
    border: 4px double #d2b77d;
}

 .navbar-nav .nav-link {
     color: #000000;
     font-weight: 300;
     margin: 4px 10px;
     font-size: 18px;
     padding: 3px 10px;
     background: none;
     border-radius: 5px;
 }

 .navbar-nav .nav-link:hover, .navbar-nav .current a {
     color: #fff;
     background:#de6e85
     
 }

 .social-icons a {
     color: #000;
     font-size: 25px;
     margin-left: 15px;
     transition: all 0.3s ease;
 }

 .social-icons a:hover {
     color: var(--accent-pink);
 }

 .phone-link {
     color: #000;
     font-weight: 600;
     text-decoration: none;
     font-size: 20px;
     white-space: nowrap;
     line-height: 1;
 }

 .phone-link:hover {
     color: var(--accent-pink);
     text-decoration: none;
 }

 /* Стили для блоков с акцентными цветами */
 .bg-light-pink {
     background-color: var(--light-pink);
 }

 .bg-light-blue {
     background-color: var(--light-blue);
 }

 /* Стили для кнопок */
 .btn-pink {
     background-color: var(--accent-pink);
     color: white;
     border-radius: 30px;
     padding: 10px 30px;
     font-weight: 600;
     border: none;
     transition: all 0.3s ease;
 }

 .btn-pink:hover {
     background-color: #e65a74;
     color: white;
     transform: translateY(-3px);
     box-shadow: 0 5px 15px rgba(251, 113, 139, 0.3);
 }

 .btn-blue {
     background-color: var(--accent-blue);
     color: white;
     border-radius: 30px;
     padding: 10px 30px;
     font-weight: 600;
     border: none;
     transition: all 0.3s ease;
 }

 .btn-blue:hover {
     background-color: #1d7a96;
     color: white;
     transform: translateY(-3px);
     box-shadow: 0 5px 15px rgba(36, 151, 185, 0.3);
 }

 /* Стили для слайдера */
 .swiper {
     border-radius: 20px;
     overflow: hidden;
 }

 .swiper-slide img {
     width: 100%;
     height: 500px;
     object-fit: cover;
     border-radius: 20px;
 }

 .swiper-button-next,
 .swiper-button-prev {
     background-color: rgba(255, 255, 255, 0.8);
     width: 50px;
     height: 50px;
     border-radius: 50%;
     color: var(--accent-pink);
 }

 .swiper-button-next:after,
 .swiper-button-prev:after {
     font-size: 20px;
     font-weight: bold;
 }

 /* Стили для блока "О нас" */
 .about-img {
     border-radius: 20px;
     overflow: hidden;
     height: 100%;
     min-height: 400px;
 }

 .about-img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 /* Стили для блока "Наши щенки" */
 .puppy-card {
     margin-bottom: 30px;
     transition: all 0.3s ease;
     padding: 10px;
     border-radius: 12px;
     background: #fff1f4;
 }

 .puppy-card h4 {
     margin-bottom:25px;
 }

 .puppy-card:hover {
     transform: translateY(-10px);
 }

 .puppy-img {
     border-radius: 12px;
     overflow: hidden;
     height: 310px;
     margin-bottom: 25px;
 }

 .puppy-img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 /* Стили для блока преимуществ */
 .feature-icon {
     font-size: 50px;
     color: var(--accent-pink);
     margin-bottom: 20px;
 }

 .feature-item {
     padding: 30px 20px;
     text-align: center;
     height: 100%;
     transition: all 0.3s ease;
 }

 .feature-item:hover {
     transform: translateY(-10px);
 }

 /* Стили для блока собак */
 .dog-card {
     margin-bottom: 30px;
 }

 .dog-img {
     border-radius: 12px;
     overflow: hidden;
     height: 300px;
     margin-bottom: 15px;
 }

 .dog-img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 /* Стили для отзывов */
 .review-thumb {
     height: 390px;
     cursor: pointer;
     border-radius: 10px;
     overflow: hidden;
 }

 .review-thumb img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 /* Стили для галереи */
 .masonry-item {
     margin-bottom: 5px;
     break-inside: avoid;
 }

 .masonry-img {
     border-radius: 10px;
     overflow: hidden;
 }

 .masonry-img img {
     width: 100%;
     height: auto;
     display: block;
 }

 /* Стили для статей */
 .article-card {
     margin-bottom: 30px;
     transition: all 0.3s ease;
     background: white;
     padding: 15px;
     border-radius: 19px;
 }

 .article-card:hover {
     transform: translateY(-10px);
 }

 .article-img {
     border-radius: 12px;
     overflow: hidden;
     height: auto;
     margin-bottom: 15px;
 }

 .article-img img {
     /* width: 100%; */
     /* height: 100%; */
     /* object-fit: cover; */
     border-radius: 50%;
     width: auto;
 }

 /* Стили для подвала */
 footer {
     background-color: #333;
     color: white;
     padding: 60px 0 30px;
 }

footer i {
    margin-right:10px;
}

 footer a {
     color: white;
     text-decoration: none;
 }

 footer a:hover {
     color: var(--accent-pink);
 }

 footer .social-icons a {
     color: white;
     font-size: 20px;
     margin-right: 15px;
 }

 /* Адаптивность */
 @media (max-width: 992px) {
     .navbar-nav {
         text-align: center;
         padding: 20px 0;
         display: block !important;
     }

     .social-icons {
         justify-content: center;
         margin-top: 0;
         margin-left: 0;
         line-height: 1;
     }

     .phone-link {
         display: block;
         text-align: center;
         margin-top: 10px;
     }
 }

 @media (max-width: 768px) {
     body {
         padding-top: 0px;
     }

     .swiper-slide img {
         height: 230px;
     }

     .review-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

     .about-img {
         min-height: 300px;
         margin-bottom: 30px;
     }
 }

 /* Стили для модального окна */
 .modal-header {
     background-color: var(--accent-pink);
     color: white;
 }

 .modal-body {
     padding: 30px;
 }

 .form-check-label {
     font-size: 18px;
 }

.logo {
    margin-top: 15px;
    text-align: center;
    margin-bottom: 30px;
}

footer .logo {
    text-align:left;
    margin-top: 0;
    margin-bottom: 20px;
}

footer .logo img {
    width:220px;
    border-radius:50%;;
}

ul.navbar-nav.mr-auto {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin: 0px 0px;
}
.privacy p a {
	color:#9b9b9b;
	font-size:14px;
	margin-right:25px;
}
.header-top {
    display: flex;
    justify-content: space-between;
}

header .d-flex {
    align-items:center;
    padding: 10px;
    border-radius: 14px;
}

header {
    padding: 10px 0;
}

.social-icons img {
    width:32px;
    min-width: 32px;
}

a.phone-link.mr-3 img {
    margin-right: 10px;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    margin-bottom: 9px;
}

button.close {
    background: white;
    border: none;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    font-size: 24px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #fb718b;
}

a.btn i {
    margin-left:10px;
}

.masonry-text {
    font-size: 18px;
    text-align: center;
    margin-top: 9px;
}


section.contacts.py-5 .fl {
    margin-bottom: 30px;
    font-size:20px;
}

section.contacts.py-5 i {
    color: var(--accent-pink);
    margin-right:10px;
}

section.contacts.py-5 a {
    color:inherit;
    text-decoration:none;
}

.map img {
    border-radius: 
20px;
}

.map {
    margin-top: 30px;
}

.map h2 {
    margin-bottom: 30px;
    text-align: center;
}

.cats ul {
    list-style: none;
    display: flex;
    margin: 0 0 30px 0;
    padding: 0;
}

.cats ul li a {
    margin-right: 20px;
    padding: 7px 25px;
    border-radius: 5px;
    border: 1px solid;
    cursor:pointer;
    transition:0.5s;
}

.cats ul li a {
    color:black;
    text-decoration:none;
}

.cats ul li.current a, .cats ul li:hover a {
    background:#de6e85;
    color:white;
}

.cats ul li:nth-child(2).current, .cats ul li:nth-child(2) a:hover {
    background: var(--accent-blue);
}

section#dogs-cat .dog-img {

    height: auto;
    overflow: auto;
}

section#dogs-cat .dog-img img {
    width: 360px;
    height: 360px;
    object-fit: cover;
    border-radius:50%;
    display:block;
}

#dogs-cat .dog-card {
    text-align: center;
}

#dogs-cat .dog-card h4 a {
    color:black;
    display:block;
    margin-top:20px;
    text-decoration:none
}

section#dogs-cat .col-lg-4:first-child .dog-img img {
    border:7px solid #c2c2c2;
}

section#dogs-cat .col-lg-4:nth-child(2) .dog-img img {
    border:7px solid #2497b9;
}

section#dogs-cat .col-lg-4:last-child .dog-img img {
    border:7px solid #fb718b;
}

.choice-block img {
    border-radius: 50%;
    width: 300px;
    display: block;
    text-align: center;
    margin: 0 auto 40px auto;
}

.har {
    padding: 30px 15px;
    background: #f6e2df;
    border-radius: 20px;
    margin-top: 30px;
}

section.dog-card {
    margin-top: 45px;
    margin-bottom: 45px;
}

.har-item {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 15px;
}

.har-val {
    text-align: left;
}

.har-name {
    font-weight: bold;
    min-width: 210px;
}

section.dog-card .row {
    align-items: center;
}

section.dog-card img {
    border-radius: 12px;
}

section.dog-card {}

section.dog-card h1 {
    margin-left: 15px;
}

.dog-card .card-text {
    margin-top: 30px;
}

section.contacts.py-5 .social-icons {юсфеы
    margin-left:0;
    margin-bottom:30px;
}

.sv img {
    border-radius: 12px;
    border: 4px double #d2b77d;
}
.slogan {
    font-family: 'Great Vibes', serif;
    font-size: 48px;
    color: var(--accent-pink);
    text-align: center;
    margin-top: 30px;
    margin-bottom: -8px;
}

.video-item {
    position: relative;
    padding: 25px;
}

.video-item video {
    border-radius: 15px;
}

.video-item .play {
    
}

#prices img {
    margin-bottom: 20px;
	}

section.dog-card h3 {
    margin-top: 35px;
    font-size: 24px;
    clear: both;
    margin-bottom: 18px;
}

.dog-card .social-icons {
    margin-left: 0;
}

.bage {
	margin-left:10px;
}

.text-right {
	text-align:right
}
footer .social-icons.mt-4 {
    margin-left: -15px;
}
.privacy p {
    margin-bottom: 5px;
}
#gallery2 .masonry-img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.client-rek {
    padding: 40px 0;
}

.client-rek p {
    margin-bottom: 5px;
}

#cookie-notification {
    display: none;
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #f1f1f1;
    color: #333;
    padding: 15px 20px;
    border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    z-index: 9999;
    max-width: 80%;
    text-align: center;
}

#cookie-notification p {
    margin: 0 0 10px 0;
    display: inline-block;
}
#cookie-notification a {
	text-decoration:underline;
}
#cookie-accept {
    background-color:#de6e85;
    color: white;
    border: none;
    padding: 8px 15px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    margin: 0 10px;
    cursor: pointer;
    border-radius: 4px;
}

#cookie-accept:hover {
    background-color: #000;
}

#cookie-notification a {
		color:black;
	}
    