/* Сброс стилей */
* {
 margin: 0;
 padding: 0;
 box-sizing: border-box;
}

body {
 font-family: Arial, sans-serif;
 line-height: 1.6;
 color: #333;
}

/* Контейнер */
.container {
 max-width: 1200px;
 margin: 0 auto;
 padding: 0 15px;
}

/* Шапка */
.header {
 background: #f8f8f8;
 padding: 20px 0;
}
.logo {
 font-size: 1.5rem;
 color: #333;
}
.nav {
 margin-top: 10px;
}
.nav a {
 margin-right: 15px;
 text-decoration: none;
 color: #0066cc;
}
.nav a:hover {
 text-decoration: underline;
}

/* Основной контент */
.main {
 padding: 20px 0;
 display: flex;
 flex-wrap: wrap;
 gap: 20px;
}
.sidebar {
 flex: 1;
 min-width: 200px;
}
.content {
 flex: 3;
 min-width: 300px;
}
.sidebar--right {
 flex: 1;
 min-width: 200px;
}

/* Блоки */
.menu, .box {
 margin-bottom: 20px;
}
.box__title {
 background: #ccc;
 padding: 10px;
 font-size: 1.2rem;
}
.box__title--blue {
 background: #0066cc;
 color: #fff;
}
.box__content {
 padding: 15px;
 background: #f9f9f9;
}
.box__content--center {
 text-align: center;
}

/* Подвал */
.footer {
 background: #f8f8f8;
 padding: 20px 0;
 text-align: center;
}

/* Попап */
.popup {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 background: rgba(0, 0, 0, 0.5);
 display: flex;
 align-items: center;
 justify-content: center;
 z-index: 1000;
}
.popup__content {
 background: #fff;
 padding: 20px;
 max-width: 500px;
 width: 90%;
 border-radius: 5px;
 position: relative;
}
.popup__title {
 font-size: 1.3rem;
 margin-bottom: 15px;
}
.popup__close {
 background: #0066cc;
 color: #fff;
 border: none;
 padding: 10px 20px;
 cursor: pointer;
 margin-top: 15px;
}
.popup__close:hover {
 background: #004d99;
}

/* Адаптивность */
@media (max-width: 768px) {
 .main {
 flex-direction: column;
 }
 .sidebar, .content, .sidebar--right {
 flex: 1;
 min-width: 100%;
 }
}