/* Шапка H–P (01.10, вторая волна). Только ≥1280; на телефоне и планшете у всех — бургер, герб, телефон (в H — герб в медальоне).
   H — медальон с «^» как в A–E, но капсулы у самого верха (12 px).
   I, J, K — расположение F (две капсулы, герб свободно) + язычок с «^» под гербом для сворачивания, капсулы у верха;
            различаются формой капсул, подачей герба и украшениями краёв.
   N–Q — свои формы: книжный разворот, угловой знак, свиток (P, Q). C, L, M удалены 02.10. Без арок и полукругов. */

@media (min-width: 1280px) {
  /* ================= H: язычок-медальон, капсулы у верха ================= */
  html[data-bar="h"] { --hdr: 78px; --wrw: 92px; }
  html[data-bar="h"] .hdr__in { grid-template-rows: 78px; align-content: start; }
  html[data-bar="h"] .hdr .lockup { margin-top: 8px; }
  html[data-bar="h"] .hdr .lockup::before { top: -8px; bottom: -34px; }
  html[data-bar="h"] .hdr .lockup::after { top: -8px; bottom: -31px; }
  html[data-bar="h"] .hdr__medal { height: calc(var(--mlh) + 42px); }
  html[data-bar="h"] .hdr__medal svg { bottom: 9px; }
  html[data-bar="h"] .hdr__wr { top: auto; bottom: 4px; transform: none; }
  html[data-bar="h"] .ed--b { display: flex; align-items: flex-end; width: var(--wrw); }

  /* ================= I, J, K: две капсулы, герб свободно, под гербом язычок «^» ================= */
  html:is([data-bar="i"], [data-bar="j"], [data-bar="k"]) { --hdr: 78px; }
  html:is([data-bar="i"], [data-bar="j"], [data-bar="k"]) .hdr__in { grid-template-rows: 78px; align-content: start; }
  html:is([data-bar="i"], [data-bar="j"], [data-bar="k"]) .hdr .lockup { position: relative; z-index: 3; }
  html:is([data-bar="i"], [data-bar="j"], [data-bar="k"]) .hdr .lockup::before { content: ""; position: absolute; inset: -18px -56px; z-index: -1; background: radial-gradient(closest-side, var(--haze) 55%, color-mix(in srgb, var(--haze) 0%, transparent)); opacity: 0; transition: opacity 300ms ease; }
  html:is([data-bar="i"], [data-bar="j"], [data-bar="k"]) .hdr.is-solid .lockup::before { opacity: 1; }
  html:is([data-bar="i"], [data-bar="j"], [data-bar="k"]) .hdr__medal { justify-self: center; width: 54px; height: 24px; margin-top: 68px; background: var(--gold); clip-path: polygon(0 0, 100% 0, 82% 100%, 18% 100%); }
  html:is([data-bar="i"], [data-bar="j"], [data-bar="k"]) .hdr__medal::before { content: ""; position: absolute; inset: 0 1.5px 1.5px; background: color-mix(in srgb, #FFFFFF 50%, var(--haze)); clip-path: polygon(0 0, 100% 0, 82% 100%, 18% 100%); }
  html:is([data-bar="i"], [data-bar="j"], [data-bar="k"]) .hdr__medal svg { bottom: 7px; }
  html:is([data-bar="i"], [data-bar="j"], [data-bar="k"]) .hdr__medal:focus-visible { outline: none; background: var(--gold-lo); }

  /* I — светлые таблички с золотым верхом, лавр у краёв */
  html[data-bar="i"] { --wrw: clamp(84px, 7vw, 112px); }
  html[data-bar="i"] .ed--a { display: block; width: var(--wrw); }
  html[data-bar="i"] .hdr__wr { color: var(--gold); }
  html[data-bar="i"] .hdr__in::before, html[data-bar="i"] .hdr__in::after { height: 50px; border-radius: 10px; border-top: 2px solid var(--gold); }

  /* J — тёмные капсулы, крупный герб, ромбы у краёв */
  html[data-bar="j"] { --wrw: 30px; --mlh: 60px; }
  html[data-bar="j"] .hdr .logo-pair { --lh: 60px; }
  html[data-bar="j"] .hdr__medal { margin-top: 70px; }
  html[data-bar="j"] .hdr__in::before, html[data-bar="j"] .hdr__in::after { background: var(--ink); border-color: color-mix(in srgb, var(--gold) 55%, transparent); box-shadow: 0 14px 30px -16px rgba(31, 31, 36, .6); }
  html[data-bar="j"] .hdr .nav .nav__g a { color: var(--haze); }
  html[data-bar="j"] .hdr .nav .nav__g a:hover { background: color-mix(in srgb, var(--gold) 35%, transparent); }
  html[data-bar="j"] .hdr .hdr__phone { color: var(--haze); }
  html[data-bar="j"] .hdr .hdr__phone .i { color: var(--gold); }
  html[data-bar="j"] .hdr__wr { top: 0; transform: none; }
  html[data-bar="j"] .ed--d { display: block; width: 28px; }

  /* K — гранёные таблички (срезанные углы), герб между двумя золотыми линиями, пилястры у краёв */
  html[data-bar="k"] { --wrw: 54px; }
  html[data-bar="k"] .hdr__in::before, html[data-bar="k"] .hdr__in::after { border: 0; border-radius: 0; margin-inline: -20px; clip-path: polygon(16px 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 16px 100%, 0 50%); box-shadow: inset 0 1px 0 var(--gold), inset 0 -1px 0 var(--gold); }
  html[data-bar="k"] .hdr .lockup::after { content: ""; position: absolute; top: 2px; bottom: 2px; left: -10px; right: -10px; border-left: 1px solid var(--gold); border-right: 1px solid var(--gold); }
  html[data-bar="k"] .hdr__wr { top: 7px; transform: none; }
  html[data-bar="k"] .ed--e { display: block; width: 54px; }
}

/* ================= L–P: общее — без сплошной плашки, фото «Кино» под шапкой ================= */
@media (min-width: 1280px) {
  html:is([data-bar="n"], [data-bar="o"], [data-bar="p"], [data-bar="q"]) .hdr.hdr { background: transparent !important; box-shadow: none !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
  html:is([data-bar="n"], [data-bar="o"], [data-bar="p"], [data-bar="q"]) .hk__bg { top: var(--hdr); }
  /* O: при прокрутке под шапкой мягкая вуаль без края */
  html[data-bar="o"] .hdr::before { content: ""; position: absolute; inset: 0 0 -36px; z-index: -1; background: linear-gradient(to bottom, var(--haze) 0%, color-mix(in srgb, var(--haze) 90%, transparent) 55%, color-mix(in srgb, var(--haze) 0%, transparent) 100%); opacity: 0; transition: opacity 300ms ease; pointer-events: none; }
  html[data-bar="o"] .hdr.is-solid::before { opacity: 1; }

  /* ================= N «Книжный разворот»: две страницы меню, в центре корешок с гербом ================= */
  html[data-bar="n"] { --hdr: 80px; --pg: color-mix(in srgb, #FFFFFF 62%, var(--haze)); --phw: 64px; --btw: 190px; }
  html[data-bar="n"] .hdr__in { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); grid-template-rows: 80px; column-gap: 0; padding-inline: clamp(24px, 2.6vw, 48px); }
  html[data-bar="n"] .hdr__phone { grid-column: 1; justify-self: start; margin-left: 18px; position: relative; z-index: 1; }
  html[data-bar="n"] .nav__g:first-child { grid-column: 1; padding: 0 24px 0 var(--phw); }
  html[data-bar="n"] .hdr .lockup { grid-column: 2; position: relative; z-index: 2; align-self: stretch; display: flex; align-items: center; padding: 0 26px; background: linear-gradient(90deg, color-mix(in srgb, var(--gold) 70%, var(--ink)) 0, color-mix(in srgb, var(--gold) 55%, var(--haze)) 9%, color-mix(in srgb, var(--gold) 28%, var(--haze)) 50%, color-mix(in srgb, var(--gold) 55%, var(--haze)) 91%, color-mix(in srgb, var(--gold) 70%, var(--ink)) 100%); box-shadow: inset 0 6px 0 color-mix(in srgb, var(--gold-lo) 80%, transparent), inset 0 -6px 0 color-mix(in srgb, var(--gold-lo) 80%, transparent), 0 14px 26px -16px rgba(31, 31, 36, .55); }
  html[data-bar="n"] .hdr .lockup::after { content: ""; position: absolute; top: 10px; bottom: 10px; left: 8px; right: 8px; border-left: 1px dashed color-mix(in srgb, var(--gold-lo) 70%, transparent); border-right: 1px dashed color-mix(in srgb, var(--gold-lo) 70%, transparent); pointer-events: none; }
  html[data-bar="n"] .nav__g:last-of-type { grid-column: 3; padding: 0 var(--btw) 0 24px; }
  html[data-bar="n"] .hdr__cta .btn { grid-column: 3; justify-self: end; margin-right: 18px; position: relative; z-index: 1; }
  html[data-bar="n"] .hdr__in::before, html[data-bar="n"] .hdr__in::after { content: ""; grid-row: 1; align-self: center; z-index: -1; height: 60px; }
  html[data-bar="n"] .hdr__in::before { grid-column: 1; background: linear-gradient(90deg, var(--pg) 0, var(--pg) 82%, color-mix(in srgb, var(--gold) 22%, var(--haze)) 100%); box-shadow: inset 0 -7px 0 -6px color-mix(in srgb, var(--gold) 60%, transparent), -3px 3px 0 color-mix(in srgb, #FFFFFF 30%, var(--haze)), -6px 6px 0 color-mix(in srgb, var(--gold) 14%, var(--haze)), 0 16px 26px -18px rgba(31, 31, 36, .5); }
  html[data-bar="n"] .hdr__in::after { grid-column: 3; background: linear-gradient(270deg, var(--pg) 0, var(--pg) 82%, color-mix(in srgb, var(--gold) 22%, var(--haze)) 100%); box-shadow: inset 0 -7px 0 -6px color-mix(in srgb, var(--gold) 60%, transparent), 3px 3px 0 color-mix(in srgb, #FFFFFF 30%, var(--haze)), 6px 6px 0 color-mix(in srgb, var(--gold) 14%, var(--haze)), 0 16px 26px -18px rgba(31, 31, 36, .5); }
  html[data-bar="n"] .hdr .nav .nav__g a { font: 500 1.0625rem/1.2 var(--f-serif); }
  html[data-bar="n"] .hdr .nav .nav__g a:hover { color: var(--gold-hi); }

  /* ================= O «Угловой знак»: крупный бейдж с гербом и ФИО в углу, меню тонким текстом, угловые орнаменты ================= */
  html[data-bar="o"] { --hdr: 72px; }
  html[data-bar="o"] .hdr__in { position: relative; grid-template-columns: auto minmax(0, 1fr) auto auto auto auto; grid-template-rows: 72px; column-gap: clamp(14px, 1.6vw, 28px); padding-left: 0; }
  html[data-bar="o"] .hdr .lockup { grid-column: 1; grid-row: 1; align-self: start; position: relative; z-index: 2; display: flex; align-items: center; height: 108px; max-width: none; padding: 0 56px 6px clamp(28px, 2.6vw, 48px); background: color-mix(in srgb, #FFFFFF 50%, var(--haze)); clip-path: polygon(0 0, 100% 0, 100% 70%, calc(100% - 32px) 100%, 0 100%); box-shadow: inset 0 -2px 0 var(--gold), inset -2px 0 0 var(--gold); }
  html[data-bar="o"] .hdr .logo-pair { --lh: 66px; }
  html[data-bar="o"] .hdr .lockup::before, html[data-bar="o"] .hdr .lockup::after { content: ""; position: absolute; width: 22px; height: 22px; pointer-events: none; }
  html[data-bar="o"] .hdr .lockup::before { top: 10px; left: 10px; border-top: 1px solid var(--gold); border-left: 1px solid var(--gold); }
  html[data-bar="o"] .hdr .lockup::after { top: 10px; right: 14px; border-top: 1px solid var(--gold); border-right: 1px solid var(--gold); }
  html[data-bar="o"] .hdr__in::after { content: ""; position: absolute; top: 12px; right: 12px; width: 26px; height: 26px; border-top: 1px solid var(--gold); border-right: 1px solid var(--gold); pointer-events: none; }
  html[data-bar="o"] .hdr__in::before { content: ""; position: absolute; top: 18px; right: 18px; width: 5px; height: 5px; background: var(--gold); transform: rotate(45deg); pointer-events: none; }
  html[data-bar="o"] .nav__g:first-child { grid-column: 3; }
  html[data-bar="o"] .nav__g:last-of-type { grid-column: 4; }
  html[data-bar="o"] .nav__g { width: auto; gap: clamp(10px, 1.4vw, 26px); }
  html[data-bar="o"] .hdr__phone { grid-column: 5; }
  html[data-bar="o"] .hdr__cta .btn { grid-column: 6; margin-right: 22px; }
  html[data-bar="o"] .hdr .nav .nav__g a { padding: 0; font: 400 .75rem/1.2 var(--f-sans); letter-spacing: .18em; text-transform: uppercase; }
  html[data-bar="o"] .hdr .nav .nav__g a:hover { color: var(--gold-hi); }
  html[data-bar="o"] .nav__g:last-of-type::before { content: ""; width: 1px; height: 18px; margin-right: clamp(4px, .8vw, 14px); background: color-mix(in srgb, var(--gold) 60%, transparent); }

  /* ================= P «Свиток» и Q «Свиток + медальон» =================
     Полотно с фактурой бумаги разворачивается от центра (clip-path), валики (бумажный рулон + стержень с навершиями) едут к краям.
     P — картуш с гербом (восьмиугольник). Q — щит-медальон с «^», на 18 % меньше, чем в A–E. Клик по гербу или «^» сматывает и разматывает свиток. */
  html:is([data-bar="p"], [data-bar="q"]) { --hdr: 80px; --wrx: clamp(10px, 1.1vw, 22px); --half: 140px; --pg: clamp(22px, 2.4vw, 44px); --side: 176px; }
  html[data-bar="q"] { --half: 128px; }
  @media (min-width: 1500px) { html:is([data-bar="p"], [data-bar="q"]) { --side: 220px; } }
  html:is([data-bar="p"], [data-bar="q"]) .hdr__in { grid-template-columns: var(--side) minmax(0, 1fr) auto auto auto minmax(0, 1fr) var(--side); grid-template-rows: 80px; padding-inline: calc(var(--wrx) + 30px); column-gap: var(--s3); }
  html:is([data-bar="p"], [data-bar="q"]) .hdr__cta .btn { justify-self: end; }
  html:is([data-bar="p"], [data-bar="q"]) .hdr__phone { margin-left: 22px; position: relative; z-index: 1; }
  html:is([data-bar="p"], [data-bar="q"]) .hdr__cta .btn { margin-right: 22px; position: relative; z-index: 1; }
  html:is([data-bar="p"], [data-bar="q"]) .nav__g { justify-content: center; gap: var(--pg); }
  html:is([data-bar="p"], [data-bar="q"]) .hdr .nav .nav__g a { position: relative; padding: 0 2px; }
  html:is([data-bar="p"], [data-bar="q"]) .nav__g a + a::before { content: ""; position: absolute; left: calc(var(--pg) / -2 - 2.5px); top: 50%; width: 5px; height: 5px; margin-top: -2.5px; background: var(--gold); transform: rotate(45deg); }
  /* полотно */
  html:is([data-bar="p"], [data-bar="q"]) .hdr__in::before { content: ""; grid-column: 1 / -1; grid-row: 1; align-self: center; z-index: -1; height: 54px; margin-inline: -8px;
    background:
      linear-gradient(90deg, rgba(90, 70, 40, .2), rgba(90, 70, 40, 0) 46px, rgba(90, 70, 40, 0) calc(100% - 46px), rgba(90, 70, 40, .2)),
      repeating-linear-gradient(90deg, rgba(120, 100, 70, .022) 0 1px, transparent 1px 7px),
      repeating-linear-gradient(0deg, rgba(255, 255, 255, .18) 0 1px, transparent 1px 4px),
      radial-gradient(120% 140% at 30% 0%, rgba(255, 255, 255, .7), transparent 60%),
      linear-gradient(to bottom, #F3EADA, #FBF7EF 38%, #EFE4D0);
    box-shadow: inset 0 1px 0 rgba(160, 131, 79, .55), inset 0 -1px 0 rgba(160, 131, 79, .55), inset 0 6px 0 -5px rgba(160, 131, 79, .45), inset 0 -6px 0 -5px rgba(160, 131, 79, .45), 0 16px 24px -16px rgba(31, 31, 36, .55);
    clip-path: inset(0 0 0 0); animation: sc-open 1.1s var(--ease-io) .25s backwards; transition: clip-path 700ms var(--ease-io); }
  /* валики: бумажный рулон и стержень с навершиями */
  html:is([data-bar="p"], [data-bar="q"]) .hdr__wr { display: flex; position: absolute; z-index: 1; top: 50%; left: var(--wrx); transform: translateY(-50%); pointer-events: none; animation: sc-roll-l 1.1s var(--ease-io) .25s backwards; transition: transform 700ms var(--ease-io); }
  html:is([data-bar="p"], [data-bar="q"]) .hdr__wr--r { left: auto; right: var(--wrx); animation-name: sc-roll-r; }
  html:is([data-bar="p"], [data-bar="q"]) .ed--p { display: block; position: relative; width: 26px; height: 56px; border-radius: 3px; background: linear-gradient(90deg, #CDBB9B 0%, #F2E8D6 30%, #FCF8F0 46%, #EADCC3 72%, #BBA67F 100%); box-shadow: 5px 8px 14px -8px rgba(31, 31, 36, .55), inset 0 2px 0 rgba(255, 255, 255, .5); }
  html:is([data-bar="p"], [data-bar="q"]) .ed--p::before { content: ""; position: absolute; inset: 6px 0; background: repeating-linear-gradient(0deg, rgba(120, 100, 70, .12) 0 1px, transparent 1px 9px); border-radius: 2px; }
  .ed--p i { position: absolute; z-index: -1; left: 50%; top: -8px; bottom: -8px; width: 9px; height: auto; margin-left: -4.5px; border-radius: 1px; background: linear-gradient(90deg, var(--gold-lo), var(--gold) 40%, #EAD5A8 55%, var(--gold-lo)); box-shadow: 3px 4px 8px -4px rgba(31, 31, 36, .5); }
  .ed--p i::before, .ed--p i::after { content: ""; position: absolute; left: -5px; right: -5px; height: 7px; border-radius: 2px; background: linear-gradient(90deg, #5A4628, var(--gold-lo) 30%, var(--gold) 55%, #5A4628); }
  .ed--p i::before { top: -4px; } .ed--p i::after { bottom: -4px; }
  /* P: картуш-восьмиугольник */
  html[data-bar="p"] .hdr .lockup { position: relative; z-index: 3; padding: 7px 24px; }
  html[data-bar="p"] .hdr .lockup::before, html[data-bar="p"] .hdr .lockup::after { content: ""; position: absolute; z-index: -1; inset: 0; clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 12px, 100% calc(100% - 12px), calc(100% - 12px) 100%, 12px 100%, 0 calc(100% - 12px), 0 12px); }
  html[data-bar="p"] .hdr .lockup::before { background: var(--gold); }
  html[data-bar="p"] .hdr .lockup::after { inset: 1.5px; background: color-mix(in srgb, #FFFFFF 50%, var(--haze)); }
  html[data-bar="p"] .hdr .logo-pair { --lh: 48px; }
  html[data-bar="p"] .hdr__medal { display: block; grid-column: 4; grid-row: 1; align-self: center; justify-self: stretch; position: relative; z-index: 4; height: 62px; padding: 0; border: 0; background: transparent; color: var(--gold-lo); cursor: pointer; }
  html[data-bar="p"] .hdr__medal svg { bottom: -4px; }
  /* Q: щит-медальон на 18 % меньше, свисает с верхнего края поверх полотна */
  html[data-bar="q"] .hdr .logo-pair { --lh: 41px; }
  html[data-bar="q"] .hdr .lockup { align-self: start; position: relative; z-index: 3; margin-top: 12px; padding: 0 21px; }
  html[data-bar="q"] .hdr .lockup::before, html[data-bar="q"] .hdr .lockup::after { content: ""; position: absolute; z-index: -1; left: 0; right: 0; top: -12px; bottom: -32px; clip-path: polygon(0 0, 100% 0, 100% 62%, 50% 100%, 0 62%); }
  html[data-bar="q"] .hdr .lockup::before { background: color-mix(in srgb, var(--gold) 75%, transparent); }
  html[data-bar="q"] .hdr .lockup::after { left: 1.5px; right: 1.5px; bottom: -30px; background: linear-gradient(to bottom, var(--haze) 30%, color-mix(in srgb, #FFFFFF 45%, var(--haze))); }
  html[data-bar="q"] .hdr__medal { display: block; grid-column: 4; grid-row: 1; align-self: start; justify-self: stretch; position: relative; z-index: 4; height: calc(41px + 44px); padding: 0; border: 0; background: transparent; color: var(--gold-lo); cursor: pointer; }
  html[data-bar="q"] .hdr__medal svg { bottom: 10px; }
  html:is([data-bar="p"], [data-bar="q"]) .hdr.is-folded .hdr__medal svg { transform: rotate(180deg); }
  html:is([data-bar="p"], [data-bar="q"]) .hdr__medal:focus-visible { outline: 2px solid var(--gold-lo); outline-offset: 2px; }
  /* смотать: полотно уходит под герб, валики съезжаются к нему, пункты гаснут раньше полотна */
  html:is([data-bar="p"], [data-bar="q"]) .hdr__phone, html:is([data-bar="p"], [data-bar="q"]) .nav__g, html:is([data-bar="p"], [data-bar="q"]) .hdr__cta .btn { transition: opacity 400ms ease 300ms, transform 600ms var(--ease-out) 200ms, visibility 0s; }
  html:is([data-bar="p"], [data-bar="q"]) .hdr.is-folded :is(.hdr__phone, .nav__g, .hdr__cta .btn) { opacity: 0; visibility: hidden; transition: opacity 200ms ease, transform 500ms var(--ease-io), visibility 0s linear 500ms; }
  html:is([data-bar="p"], [data-bar="q"]) .hdr.is-folded :is(.hdr__phone, .nav__g:first-child) { transform: translateX(60px); }
  html:is([data-bar="p"], [data-bar="q"]) .hdr.is-folded :is(.nav__g:last-of-type, .hdr__cta .btn) { transform: translateX(-60px); }
  html:is([data-bar="p"], [data-bar="q"]) .hdr.is-folded .hdr__in::before { clip-path: inset(0 calc(50% - var(--half) + 26px) 0 calc(50% - var(--half) + 26px)); }
  html:is([data-bar="p"], [data-bar="q"]) .hdr.is-folded .hdr__wr--l { transform: translate(calc(50vw - var(--wrx) - var(--half)), -50%); }
  html:is([data-bar="p"], [data-bar="q"]) .hdr.is-folded .hdr__wr--r { transform: translate(calc(var(--half) - 50vw + var(--wrx)), -50%); }
  html:is([data-bar="p"], [data-bar="q"]) .hdr.is-solid:not(.is-folded) .hdr__wr { opacity: 1; visibility: visible; }
}
@keyframes sc-open { from { clip-path: inset(0 calc(50% - var(--half) + 26px) 0 calc(50% - var(--half) + 26px)); } }
@keyframes sc-roll-l { from { transform: translate(calc(50vw - var(--wrx) - var(--half)), -50%); } }
@keyframes sc-roll-r { from { transform: translate(calc(var(--half) - 50vw + var(--wrx)), -50%); } }
@media (prefers-reduced-motion: reduce) {
  html:is([data-bar="p"], [data-bar="q"]) .hdr *, html:is([data-bar="p"], [data-bar="q"]) .hdr *::before, html:is([data-bar="p"], [data-bar="q"]) .hdr__in::before { transition: none !important; animation: none !important; }
}
