/* ---------- ПОДКЛЮЧЕНИЕ ШРИФТОВ ---------- */
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/roboto/roboto-regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/roboto/roboto-bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'Franklin Gothic Demi Cond';
  src: url('../fonts/Franklin/ofont.ru_Franklin\ Gothic\ Demi\ Cond.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Arkhip';
  src: url('../fonts/Arkhip/ofont.ru_Arkhip.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

/* ---------- РАБОЧАЯ FLEX-СТРУКТУРА ДЛЯ ВСЕЙ ВЫСОТЫ ---------- */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  min-height: 100vh;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Roboto', 'Arial', sans-serif;
  background: #e0e0e0;
  display: flex;
  flex-direction: column;
}

/* ---------- КОНТЕЙНЕР: растягивается на всю высоту ---------- */
.container {
  max-width: 1140px;
  width: 100%;
  margin: 0 auto;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  height: 100%;
  background: transparent;
}

/* ---------- ХЕДЕР ---------- */
.header {
  width: 100%;
  min-height: 520px;
  background-image: url('../img/header-1140px.jpg');
  background-size: cover;
  background-position: center 30%;
  background-repeat: no-repeat;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 40px 90px 50px;
  flex-shrink: 0;
  margin: 0;
}

.logo {
  position: absolute;
  top: 30px;
  left: 90px;
  z-index: 2;
}

.logo img {
  width: 150px;
  height: auto;
  display: block;
}

.header-text {
  max-width: 70%;
  color: #ffffff;
  z-index: 2;
  font-family: 'Franklin Gothic Demi Cond', 'Arial Black', sans-serif;
}

.header-text h1 {
  font-size: 42px;
  font-weight: 700;
  letter-spacing: -0.5px;
  line-height: 1.2;
  margin-bottom: 0;
}

.header-text h1 .accent {
  color: #f5d78e;
}

.header-text .sub {
  font-size: 42px;
  font-weight: 400;
  line-height: 1.2;
}

.header-text .yellow {
  color: #d0ae7a;
}

/* ---------- ОСНОВНОЙ КОНТЕНТ: занимает всё свободное место ---------- */
.content {
  background: #fcf8f0;
  font-family: 'Roboto', 'Arial', sans-serif;
  padding: 2.5rem 90px;
  flex: 1;
  margin: 0;
}

/* ---------- БЛОК ТЕКСТА ---------- */
.text-block .subtitle {
  font-family: 'Roboto', 'Arial', sans-serif;
  font-size: 28px;
  font-weight: 700;
  color: #af8c55;
  margin-top: 30px;
  margin-bottom: 30px;
  letter-spacing: 0.3px;
}

.text-block p {
  font-family: 'Roboto', 'Arial', sans-serif;
  font-size: 18px;
  color: #221e1a;
  text-align: justify;
  margin-bottom: 10px;
}

.text-block p:last-child {
  margin-bottom: 0;
}

/* ---------- ЦИТАТЫ ---------- */
.quote {
  position: relative;
  font-family: 'Roboto', 'Arial', sans-serif;
  font-size: 18px;
  font-style: italic;
  color: #221e1a;
}

.quote .text {
  display: block;
  padding: 0 120px;
  text-align: justify;
}

.quote .open-quote,
.quote .close-quote {
  position: absolute;
  top: 50%;
  font-family: 'Arkhip', serif;
  font-size: 180px;
  line-height: 1;
  color: #356ad5;
  font-style: normal;
  pointer-events: none;
  user-select: none;
}

.quote .open-quote {
  left: 40px;
  transform: translateY(-50%) translateY(-35%);
}

.quote .close-quote {
  right: 40px;
  transform: translateY(-50%) translateY(25%);
}

/* ---------- КАРТИНКИ ---------- */
.image-block img {
  width: 100%;
  max-width: 700px;
  height: auto;
  max-height: 600px;
  object-fit: contain;
  display: block;
}

/* ---------- ФУТЕР: фиксированная высота, не сжимается ---------- */
.footer {
  background: #356ad5;
  padding: 30px 90px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  margin: 0;
  width: 100%;
}

.footer .copyright {
  font-family: 'Roboto', 'Arial', sans-serif;
  font-size: 16px;
  color: #ffffff;
  letter-spacing: 0.5px;
}

.footer .copyright span {
  font-weight: 700;
}

.footer .copyright a {
  color: #ffffff;
  text-decoration: none;
}

.footer .copyright a:hover {
  color: #ffffff;
  text-decoration: underline;
}

/* ---------- АДАПТИВНЫЕ ПРАВКИ ---------- */
@media (max-width: 1200px) {
  .header { padding: 30px 80px 40px; }
  .logo { left: 80px; }
  .content { padding: 2rem 80px; }
  .footer { padding: 25px 80px; }
}

@media (max-width: 992px) {
  .header { padding: 30px 60px 40px; background-image: url('../img/header-960px.jpg'); min-height: 400px; }
  .logo { top: 30px; left: 60px; }
  .logo img { width: 160px; }
  .header-text { max-width: 75%; }
  .header-text h1 { font-size: 32px; }
  .header-text .sub { font-size: 32px; }

  .content { padding: 2rem 60px; }

  .quote { font-size: 16px; }
  .quote .open-quote,
  .quote .close-quote { font-size: 120px; }
  .quote .open-quote { left: 20px; transform: translateY(-50%) translateY(-20%); }
  .quote .close-quote { right: 20px; transform: translateY(-50%) translateY(20%); }
  .quote .text { padding: 0 80px; }

  .text-block .subtitle { font-size: 22px; }
  .text-block p { font-size: 16px; }

  .footer { padding: 20px 60px; }
  .footer .copyright { font-size: 14px; }
}

@media (max-width: 768px) {
  .header { padding: 20px 40px 20px; min-height: 280px; background-image: url('../img/header-720px.jpg'); background-size: cover; }
  .logo { top: 20px; left: 40px; }
  .logo img { width: 120px; }
  .header-text { max-width: 85%; }
  .header-text h1 { font-size: 24px; }
  .header-text .sub { font-size: 24px; margin-top: 4px; }

  .content { padding: 1.5rem 40px; }

  .quote { font-size: 14px; }
  .quote .open-quote,
  .quote .close-quote { font-size: 80px; }
  .quote .open-quote { left: 12px; transform: translateY(-50%) translateY(-15%); }
  .quote .close-quote { right: 12px; transform: translateY(-50%) translateY(15%); }
  .quote .text { padding: 0 50px; }

  .text-block .subtitle { font-size: 20px; margin-top: 20px; margin-bottom: 20px; }
  .text-block p { font-size: 15px; }

  .image-block img { max-height: 350px; }

  .footer { padding: 16px 40px; }
  .footer .copyright { font-size: 13px; }
}

@media (max-width: 576px) {
  .header { padding: 16px 20px 16px; min-height: 220px; background-image: url('../img/header-720px.jpg'); }
  .logo { top: 14px; left: 20px; }
  .logo img { width: 80px; }
  .header-text { max-width: 95%; }
  .header-text h1 { font-size: 18px; }
  .header-text .sub { font-size: 18px; margin-top: 2px; }

  .content { padding: 1rem 20px; }

  .quote { font-size: 13px; }
  .quote .open-quote,
  .quote .close-quote { font-size: 60px; }
  .quote .open-quote { left: 8px; transform: translateY(-50%) translateY(-12%); }
  .quote .close-quote { right: 8px; transform: translateY(-50%) translateY(12%); }
  .quote .text { padding: 0 40px; }

  .text-block .subtitle { font-size: 17px; margin-top: 15px; margin-bottom: 15px; }
  .text-block p { font-size: 14px; }

  .image-block img { max-height: 280px; }

  .footer { padding: 12px 20px; }
  .footer .copyright { font-size: 12px; }
}

@media (max-width: 400px) {
  .header { padding: 12px 15px 12px; min-height: 180px; }
  .logo { top: 12px; left: 15px; }
  .logo img { width: 75px; }
  .header-text h1 { font-size: 16px; }
  .header-text .sub { font-size: 16px; }

  .content { padding: 0.8rem 15px; }

  .quote { font-size: 12px; }
  .quote .open-quote,
  .quote .close-quote { font-size: 50px; }
  .quote .open-quote { left: 6px; transform: translateY(-50%) translateY(-10%); }
  .quote .close-quote { right: 6px; transform: translateY(-50%) translateY(10%); }
  .quote .text { padding: 0 35px; }

  .text-block .subtitle { font-size: 15px; }
  .text-block p { font-size: 13px; }

  .image-block img { max-height: 220px; }

  .footer { padding: 10px 15px; }
  .footer .copyright { font-size: 11px; }
}