/* Шапка */
   
   body {		
		background-image: url(/kartinki/Tallinn.jpg);
		background-position: top;
		background-repeat: rep;
		background-attachment: fixed;
	}

	.main {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-content: center;
	}

	.toplogo {
		background-color: transparent;
	}

	.ilogo {
		url(/img/koos_logo_mobile.svg);
		margin-left: 20px;
	}

	.announcement-header {
		display: none;
	}
	
	.transp-block {
		background-color: rgba(255, 255, 255, 0.6);
		margin-top: 40px;
		display: flex;
		flex-direction: column;
		width: 100%;
	}
	
	.transp-block-b {
		background-color: rgba(0, 0, 0, 0.4);
		margin-top: 40px;
		display: flex;
		flex-direction: column;
		width: 100%;
	}
   
    .header-v {
        color: white;
        text-align: center;
        position: relative;
	    margin: 20px 0;
	    display: flex;
	    flex-direction: row;
	    align-items: center;
	    justify-content: space-between;
	    margin-top: 30px;
    }

    /* Подвал */
    .footer {
        background: #2a4d69;
        color: white;
        padding: 15px;
        text-align: center;
        margin-top: 40px;
    }
	
	.koos-intro { 
		padding: 40px 80px 12px 80px;
		display: flex;
		flex-direction: column;
	}

    /* Выпадающее меню */
    .dropdown {
      position: relative;
      display: inline-block;
    }

    .dropbtn-v {
      background: #4b86b4;
      color: white;
      padding: 12px 20px;
      font-size: 16px;
      border: none;
      cursor: pointer;
      border-radius: 6px;
	  margin-top: 20px;
    }

    .dropdown-content {
      display: none;
      position: absolute;
      min-width: 200px;
      box-shadow: 0 4px 6px rgba(0,0,0,0.1);
      z-index: 1;
    }

    .dropdown-content a {
      padding: 12px 16px;
      text-decoration: none;
      display: block;
    }

    .dropdown:hover .dropdown-content {
      display: block;
    }

    /* Аккордеон */
    .accordion {
      width: 90%;
      margin: 40px auto;
      background: white;
      border-radius: 6px;
      box-shadow: 0 2px 4px rgba(0,0,0,0.1);
      overflow: hidden;
    }

    .accordion-item {
      border-bottom: 1px solid #ddd;
    }

    .accordion-header {
      background: #e7eff6;
      cursor: pointer;
      padding: 15px;
      font-weight: bold;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .accordion-header:hover {
      background: #dbe7f0;
    }

    .accordion-header::after {
      content: "▶";
      font-size: 14px;
      transition: transform 0.3s;
    }

    .accordion-header.active::after {
      transform: rotate(90deg);
    }

    .accordion-content {
      display: none;
      padding: 15px;
      background: #fafafa;
    }

    /* Подуровень */
    .sub-accordion {
     /* margin-top: 10px;
      border-left: 2px solid #ccc;
      padding-left: 10px; */
    }

    .sub-accordion-header {
      cursor: pointer;
      padding: 8px;
      background: #f0f8ff;
      margin-bottom: 5px;
      display: flex;
      justify-content: space-between;
    }

    .sub-accordion-header::after {
      content: "▼";
      font-size: 12px;
      transition: transform 0.3s;
    }

    .sub-accordion-header.active::after {
      transform: rotate(180deg);
    }

    .sub-accordion-content {
      display: none;
      padding: 8px;
      background: #ffffff;
      border: 1px solid #eee;
    }

    /* Кнопки внутри текста */
    .text-buttons {
      margin: 30px auto;
      font-size: 18px;
      line-height: 1.6;
	  display: flex;
	  align-items: center;
	  justify-content: center;
    }

    .inline-btn {
      display: inline-block;
      background: #257bbf;
      color: white;
      padding: 6px 12px;
      border-radius: 6px;
      text-decoration: none;
      margin: 0 4px;
      font-size: 16px;
    }
	
	.inline-btn-top {
		display: inline-block;
		background: #257bbf;
		color: white;
		padding: 12px 18px;
		border-radius: 6px;
		text-decoration: none;
		font-size: 20px;
	}
	
	.inline-btn-top:hover {
		color: white;
		background: #2d92e1;
	}
	
	.inline-btn-top-green {
		display: inline-block;
		background: #19cb64;
		color: white;
		padding: 12px 18px;
		border-radius: 6px;
		text-decoration: none;
		font-size: 20px;
	}
	
	.inline-btn-top-green:hover {
		background: #0fdd66;
		color: white;
	}

    .inline-btn:hover {
      background: #4b86b4;
	  color: white;
    }
	
	.inline-btn-green {
      display: inline-block;
      background-color: #19cb64;
      color: white;
      padding: 6px 12px;
      border-radius: 6px;
      text-decoration: none;
      margin: 0 4px;
      font-size: 16px;
    }

    .inline-btn-green:hover {
      background: #1CB05B;
	  color: white;
    }
	
	.wrapper {
		max-width: 1320px;
		display: flex;
		flex-wrap: wrap;
		padding: 0;
		margin: 0 auto;
		justify-content: center;
		flex-direction: row;
		align-content: center;
	}
	
	.team-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
	margin: 40px 40px;
	}
	
	.team-row-k {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
	margin: 40px 40px;
	flex-direction: column
	}

	.team-member {
		flex: 1 1 120px;
		text-align: center;
		margin-bottom: 15px;
	}

	.team-city {
		font-weight: bold;
		margin-bottom: 5px;
		font-size: 15pt;
		text-align: left;
		padding-left: 35px;
	}

	.team-name {
		font-size: 0.95em;
		color: #333;
		text-align: left;
		padding-left: 35px;
		font-size: 15pt;
		line-height: 1.5;
	}
	
	.h2-kov {
		background: transparent; 
		color: black;
		margin-top: 30px;
		font-size: 25px;
	}
	
	.h2-kov-2 {
		background: transparent; 
		color: black;
		text-align: left;
		justify-content: left;
	}
	
	.p-kov {
		margin-top: 20px; 
		margin-bottom: 60px; 
		text-align: left; 
		padding: 0 80px;
		font-size: 15pt;
	}
	
	p {padding-left: 8px;
		font-size: 15pt;}
	
	li {
		margin-left: 40px;
	}

	.bottom-v-p {
		color: white; 
		margin-right: 10px;
	}

	.bottom-v-p-2 {
		color: white; 
		margin: 0 10px 0px 70px;
	}

	.footer {max-width: 1320px;}
	
	.section-k {display: flex; justify-content: space-evenly;}

/* 📱 Для экранов меньше 768px */
@media (max-width: 768px) {
	.wrapper {
		flex-direction: row;
	}
	.text-buttons {
		flex-direction: column;
		width: 100%;
		padding: 12px 0;
	}
	.text-buttons p {
		font-size: 14pt;
		margin: 20px 0 20px 0;
	}
	.transp-block-b {
		display: block;
		padding: 40px;
	}
	.inline-btn-top-green, .inline-btn-top {
		text-align: center;
		width: 100%;
		padding: 12px 0;
		margin: 0;
        margin-bottom: 30px;
	}
	.team-name {
		padding-left: 0px;
	}
	.p-kov {    
		padding: 0 40px;
	}
	.header {
		flex-wrap: wrap;
	}
	.ilogo {margin-left: 0;}
	.koos-intro {padding: 0;}
	.header-v {flex-direction: column;}
	.team-city {padding-left: 0;}
	.section-k {display: flex; flex-direction: column;}
	.team-row {flex-direction: column; gap: 0; margin: 10px 40px;}
	.team-row-k {margin: 10px 40px; gap: 0;}
	.team-member {display: flex; flex-direction: column; justify-content: center;}
}

/* 📱 Для очень маленьких экранов (например <480px) */
@media (max-width: 480px) {
  
}