/* --- БАЗА --- */
    :root{
      --panel-bg: rgba(255,255,255,0.96);
      --panel-shadow: 0 10px 25px rgba(0,0,0,.25);
      --content-max: 1000px;
      --top-offset: 4px; /* Базовый отступ сверху — регулируется в @media */
    }

    * { box-sizing: border-box; }
    html, body { height: 100%; }
    body{
      margin: 0;
      font: 16px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
      color: #1e1e1e;

      /* 1) Фон 2700х3400. Прокручивается вместе со страницей (attachment: scroll по умолчанию). */
      background-image: url("https://site-of-thrones.net/templates/thronetheme/images/bg.jpg"); /* <-- замените на свой путь */
      background-repeat: no-repeat;
      background-position: center top;
      background-size: cover;
      background-attachment: scroll; /* явно укажем, чтобы не было fixed */
    }
	.prest-logo { width:100%; height:292px; min-width:320px; background: url(https://site-of-thrones.net/templates/thronetheme/images/head.png) no-repeat; background-position: top center;}

    /* Лёгкая полупрозрачная дымка поверх фона для читабельности */
    .backdrop{
      position: fixed;
      inset: 0;
      background: radial-gradient(1200px 600px at 50% 0%, rgba(0,0,0,.25), transparent 60%),
                  linear-gradient(to bottom, rgba(0,0,0,.15), rgba(0,0,0,0));
      pointer-events: none;
      z-index: 0;
    }

    /* --- КОНТЕЙНЕР ОСНОВНОГО КОНТЕНТА --- */
    .container{
      position: relative;
      z-index: 1;
      max-width: var(--content-max);
      margin: var(--top-offset) auto 56px auto;
      background: var(--panel-bg);
      box-shadow: var(--panel-shadow);
      backdrop-filter: saturate(110%) blur(2px);
    }
	
	article {padding: 2px 8px 8px;}

    /* Спидбар (хлебные крошки) */
    .speedbar{
      display: flex;
      align-items: center;
      gap: .5rem;
      min-height: 50px;
      padding: 10px 14px;
      margin: -2px 0 14px;
      background: linear-gradient(to bottom, #617b92 0%, #173148 100%);
      color: #ffffff;
      font-size: 14px;
      overflow-x: auto;
      white-space: nowrap;
    }
    .speedbar a{ color: inherit; text-decoration: none; opacity: .95; }
    .speedbar a:hover{ text-decoration: underline; }
    .sep{ opacity:.45; }

    /* Текстовые элементы */
    h1{
      font-size: 28px;
      line-height: 1.25;
      margin: 8px 0 14px;
      letter-spacing:.2px;
    }
    p{ margin: 0 0 1em; }
    .lead{ opacity:.9 }

    /* --- РЕСПОНСИВНЫЙ YouTube --- */
    .video{
      position: relative;
      width: 100%;
      aspect-ratio: 16/9;          /* Современный способ */
      background: #000;
      border-radius: 10px;
      overflow: hidden;
      box-shadow: 0 8px 18px rgba(0,0,0,.25);
      margin: 16px 0 10px;
    }
    .video iframe{
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      border: 0;
    }
	
	.foot {
		font: 18px Tahoma, Geneva, sans-serif;
		font-weight: 700;
		padding:20px 40px 20px 20px;
		background-color:#333;
		background: linear-gradient(to top, #617b92 0%, #173148 100%);
		color:#e3e3e3;
		min-height:70px;
		position:relative;
		box-shadow:inset 0 20px 20px -20px rgba(0,0,0,0.5);
	}

    /* --- АДАПТИВНЫЕ ПРАВИЛА --- */
    /* 1220px */
    @media screen and (max-width: 1220px){
      :root{ --top-offset: 2px; --content-max: 880px; }
      h1{ font-size: 26px; }
    }

    /* 950px */
    @media screen and (max-width: 950px){
      :root{ --top-offset: 2px; --content-max: 820px; }
	  .prest-logo {background-size:920px; height:205px}
      .container{ padding: 20px 22px 24px; }
    }

    /* 760px */
    @media screen and (max-width: 760px){
      :root{ --top-offset: 2px; --content-max: 680px; }
	  .prest-logo {background-size:720px; height:165px}
      body{ font-size: 15.5px; }
      h1{ font-size: 24px; }
      .speedbar{ font-size: 13.5px; margin: -4px -4px 14px; }
    }

    /* 590px */
    @media screen and (max-width: 590px){
      :root{ --top-offset: 2px; --content-max: 520px; }
	  .prest-logo {background-size:576px; height:130px}
      .container{ padding: 18px 16px 20px; border-radius: 10px; }
      h1{ font-size: 22px; }
    }

    /* 470px */
    @media screen and (max-width: 470px){
      :root{ --top-offset: 2px; --content-max: 100%; }
	  .prest-logo {background-size:448px; height:105px}
      body{ font-size: 15px; }
      .container{ margin: var(--top-offset) 10px 40px; padding: 16px 14px 18px; }
      h1{ font-size: 20px; }
    }