/* Base Styles */
 :root {
   --primary: #2c3e50;
   --secondary: #3498db;
   --accent: #e74c3c;
   --light: #ecf0f1;
   --dark: #2c3e50;
   --gray: #95a5a6;
   --text: #333;
   --text-light: #7f8c8d;
 }

 * {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
 }

 body {
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   line-height: 1.6;
   color: var(--text);
   overflow-x: hidden;
 }

 .container {
   width: 100%;
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 20px;
 }

 h1,
 h2,
 h3,
 h4 {
   margin-bottom: 1rem;
   line-height: 1.2;
 }

 h1 {
   font-size: 2.5rem;
 }

 h2 {
   font-size: 2rem;
 }

 h3 {
   font-size: 1.75rem;
 }

 h4 {
   font-size: 1.5rem;
 }

 p {
   margin-bottom: 1rem;
 }

 a {
   text-decoration: none;
   color: var(--secondary);
   transition: color 0.3s;
 }

 a:hover {
   color: var(--accent);
 }

 .btn {
   display: inline-block;
   padding: 12px 24px;
   background-color: var(--accent);
   color: white;
   border: none;
   border-radius: 4px;
   font-weight: 600;
   cursor: pointer;
   transition: all 0.3s;
   text-align: center;
 }

 .btn:hover {
   background-color: #c0392b;
   transform: translateY(-2px);
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 }

 .section {
   padding: 60px 0;
   position: relative;
 }

 .section-title {
   text-align: center;
   margin-bottom: 30px;
   position: relative;
 }

 .section-title:after {
   content: '';
   display: block;
   width: 80px;
   height: 4px;
   background-color: var(--accent);
   margin: 20px auto 0;
 }

 /* Header */
 .header {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   background-color: white;
   box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
   z-index: 1000;
   transition: all 0.3s;
 }

 .header.scrolled {
   padding: 10px 0;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
 }

 .header .container {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 15px 20px;
 }

 .logo img {
   height: 50px;
 }

 .main-nav ul {
   display: flex;
   list-style: none;
 }

 .main-nav li {
   margin-left: 30px;
 }

 .main-nav a {
   color: var(--dark);
   font-weight: 600;
   position: relative;
 }

 .main-nav a:after {
   content: '';
   position: absolute;
   bottom: -5px;
   left: 0;
   width: 0;
   height: 2px;
   background-color: var(--accent);
   transition: width 0.3s;
 }

 .main-nav a:hover:after {
   width: 100%;
 }

 .burger {
   display: none;
   background: none;
   border: none;
   cursor: pointer;
   padding: 10px;
 }

 .burger span {
   display: block;
   width: 25px;
   height: 3px;
   background-color: var(--dark);
   margin: 5px 0;
   transition: all 0.3s;
 }

 /* Hero Section */
 .hero {
   height: 100vh;
   min-height: 600px;
   background: linear-gradient(rgba(44, 62, 80, 0.8), rgba(44, 62, 80, 0.8)),
     url('../images/photo-1450101499163-c8848c66ca85.avif') no-repeat center/cover;
   color: white;
   display: flex;
   align-items: center;
   text-align: center;
   padding-top: 80px;
 }

 .hero h1 {
   font-size: 3rem;
   margin-bottom: 20px;
   animation: fadeInUp 1s ease;
 }

 .hero .subtitle {
   font-size: 1.5rem;
   margin-bottom: 40px;
   animation: fadeInUp 1s ease 0.2s forwards;
   opacity: 0;
 }

 .hero .btn {
   animation: fadeInUp 1s ease 0.4s forwards;
   opacity: 0;
 }

 /* About Section */
 .about .content {
   display: flex;
   align-items: center;
   gap: 40px;
   flex-direction: column;
 }

 .about .float-right {
   float: right;
   margin-left: 40px;
   margin-bottom: 20px;
   border-radius: 8px;
   box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
   max-width: 600px;
   animation: fadeInRight 1s ease;
 }

 /* Research Section */
 .research-swiper {
   padding: 20px;
 }

 .swiper-slide {
   background-color: white;
   border-radius: 8px;
   box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
   padding: 30px;
   height: auto;
 }

 /* Types Section */
 .risk-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 30px;
 }

 .risk-card {
   background-color: white;
   border-radius: 8px;
   box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
   padding: 30px;
   transition: transform 0.3s, box-shadow 0.3s;
 }

 .risk-card:hover {
   transform: translateY(-10px);
   box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
 }

 /* Gallery Section */
 .gallery-swiper {
   padding: 20px;
 }

 .gallery-slide img {
   width: 100%;
   height: 400px;
   object-fit: cover;
   border-radius: 8px;
 }

 /* Reviews Section */
 .reviews-swiper {
   padding: 20px;
 }

 .review-card {
   background-color: white;
   border-radius: 8px;
   box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
   padding: 30px;
   position: relative;
 }

 .review-card:before {
   content: '"';
   font-size: 80px;
   position: absolute;
   top: 10px;
   left: 20px;
   color: var(--light);
   z-index: 0;
 }

 .review-content {
   position: relative;
   z-index: 1;
 }

 .review-author {
   display: flex;
   align-items: center;
   margin-top: 20px;
 }

 .review-author img {
   width: 50px;
   height: 50px;
   border-radius: 50%;
   margin-right: 15px;
   object-fit: cover;
 }

 /* FAQ Section */
 .accordion-item {
   margin-bottom: 15px;
   border-radius: 8px;
   overflow: hidden;
   box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
 }

 .accordion-header {
   background-color: var(--primary);
   color: white;
   padding: 15px 20px;
   cursor: pointer;
   display: flex;
   justify-content: space-between;
   align-items: center;
 }

 .accordion-content {
   background-color: white;
   padding: 0 20px;
   max-height: 0;
   overflow: hidden;
   transition: max-height 0.3s ease;
 }

 .accordion-content-inner {
   padding: 20px 0;
 }

 .accordion-item.active .accordion-content {
   max-height: 500px;
 }

 /* Book Download Section */
 .book-download {
   background-color: var(--primary);
   color: white;
   text-align: center;
 }

 .download-form {
   max-width: 600px;
   margin: 0 auto;
 }

 .form-group {
   margin-bottom: 20px;
   text-align: left;
 }

 .form-control {
   width: 100%;
   padding: 12px 15px;
   border: none;
   border-radius: 4px;
   font-size: 16px;
 }

 /* Footer */
 .footer {
   background-color: var(--dark);
   color: white;
   padding: 60px 0 30px;
 }

 .footer .container {
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
 }

 .footer-contacts {
   flex: 1;
   min-width: 300px;
   margin-bottom: 30px;
 }

 .footer-links {
   flex: 1;
   min-width: 300px;
   display: flex;
   flex-direction: column;
 }

 .footer-links a {
   color: white;
   margin-bottom: 10px;
 }

 .copyright {
   width: 100%;
   text-align: center;
   margin-top: 40px;
   padding-top: 20px;
   border-top: 1px solid rgba(255, 255, 255, 0.1);
 }

 /* Cookie Banner */
 .cookie-banner {
   position: fixed;
   bottom: 0;
   left: 0;
   width: 100%;
   background-color: var(--dark);
   color: white;
   padding: 20px;
   display: flex;
   justify-content: space-between;
   align-items: center;
   z-index: 1000;
   transform: translateY(100%);
   transition: transform 0.3s;
 }

 .cookie-banner.show {
   transform: translateY(0);
 }

 .cookie-banner .buttons {
   display: flex;
   align-items: center;
 }

 .cookie-banner .btn {
   margin-left: 15px;
 }

 .cookie-banner .link {
   color: var(--secondary);
   margin-left: 15px;
 }

 /* Animations */
 @keyframes fadeInUp {
   from {
     opacity: 0;
     transform: translateY(20px);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 @keyframes fadeInRight {
   from {
     opacity: 0;
     transform: translateX(20px);
   }

   to {
     opacity: 1;
     transform: translateX(0);
   }
 }

 /* Mobile Styles */
 @media (max-width: 1200px) {
   .main-nav {
     position: fixed;
     top: 80px;
     left: 0;
     width: 100%;
     background-color: white;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
     padding: 20px;
     transform: translateY(-150%);
     transition: transform 0.3s;
   }

   .main-nav.active {
     transform: translateY(0);
   }

   .main-nav ul {
     flex-direction: column;
   }

   .main-nav li {
     margin: 10px 0;
   }

   .burger {
     display: block;
   }

   .burger.active span:nth-child(1) {
     transform: rotate(45deg) translate(5px, 5px);
   }

   .burger.active span:nth-child(2) {
     opacity: 0;
   }

   .burger.active span:nth-child(3) {
     transform: rotate(-45deg) translate(7px, -6px);
   }

   .about .content {
     flex-direction: column;
   }

   .about .float-right {
     float: none;
     margin: 0 0 20px 0;
     width: 100%;
   }

   .risk-grid {
     grid-template-columns: 1fr;
   }

   .hero h1 {
     font-size: 2.2rem;
   }

   .hero .subtitle {
     font-size: 1.2rem;
   }
 }

 .accordion-content-inner ul {
   padding-left: 30px;
 }

 .reviews-swiper .swiper-pagination {
   bottom: -4px;
 }

 .gallery-swiper img {
   width: 100%;
   height: auto;
   object-fit: contain;
 }

 .gallery-swiper .swiper-pagination {
   bottom: -4px;
 }

 .research-swiper .swiper-pagination{
     bottom: -4px;
 }

 .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after{
  content: none;
 }

 .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after{
  content: none;
 }

 @media (max-width:600px) {
  .research-swiper{
    padding: 5px;
  }

  .research-swiper{
    padding-bottom: 20px;
  }

  .research-swiper .swiper-slide{
    padding: 15px;
  }

  .risk-card{
    padding: 15px;
  }

  .gallery-swiper{
    padding: 5px;
    padding-bottom: 20px;
  }

  .gallery-swiper .swiper-slide{
    padding: 5px;
  }

  .reviews-swiper{
    padding: 5px;
    padding-bottom: 20px;
  }

  .reviews-swiper .swiper-slide{
    padding: 0;
  }

  .reviews-card{
    padding: 10px;
    height: 100%;
  }
}