/* burger */
:root{--ease-out:cubic-bezier(.4,0,1,1)}
.burger{display:none;background:none;border:0;cursor:pointer;width:44px;height:44px;color:var(--ink);margin-right:-10px}
.burger svg{width:26px;height:26px}
body.menu-open .burger{visibility:hidden}

/* full-screen menu: нативный dialog, showModal даёт верхний слой, инертный фон, фокус и Esc */
.menu{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;
  margin:0;padding:0;border:0;background:#0a1c14;color:var(--cream);
  overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  opacity:0;
  transition:opacity .17s var(--ease-out),overlay .17s allow-discrete,display .17s allow-discrete}
.menu[open]{opacity:1;transition-duration:.28s;transition-timing-function:var(--ease)}
@starting-style{.menu[open]{opacity:0}}
.menu::backdrop{background:#0a1c14;opacity:0;transition:opacity .17s}
.menu[open]::backdrop{opacity:1;transition-duration:.28s}
@starting-style{.menu[open]::backdrop{opacity:0}}

.menu-in{min-height:100%;display:flex;flex-direction:column;gap:clamp(22px,4.5vw,32px);
  padding:14px var(--pad) clamp(28px,6vw,44px)}
.menu-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none;height:58px}
.menu-brand{display:flex;align-items:center;gap:.55em;
  font-family:var(--serif);font-size:1.4rem;font-weight:600;color:var(--cream);letter-spacing:.01em}
.menu-brand .mark{width:22px;height:22px;color:var(--gold-2);flex:none}
.menu-close{display:grid;place-items:center;width:44px;height:44px;margin-right:-10px;
  background:none;border:0;cursor:pointer;color:rgba(236,228,212,.8);transition:color .25s}
.menu-close svg{width:26px;height:26px}
.menu-close:hover{color:var(--gold-2)}
.menu :focus-visible{outline-color:var(--gold-2)}
.menu-nav{display:grid;gap:clamp(20px,4vw,28px)}
.menu-col h2{font-family:var(--sans);font-size:.74rem;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(205,168,95,.85);line-height:1.2;margin-bottom:.25em}
.menu-col a{display:block;font-family:var(--serif);font-size:1.5rem;font-weight:600;
  line-height:1.3;letter-spacing:-.01em;color:rgba(236,228,212,.87);padding:.27em 0;
  border-bottom:1px solid var(--line-d);transition:color .25s,padding-left .3s var(--ease)}
.menu-col a:last-child{border-bottom:0}
.menu-col a:hover{color:var(--gold-2);padding-left:4px}
.menu-cta{display:flex;align-items:center;justify-content:center;gap:.5em;flex:none;
  margin-top:clamp(8px,1.6vw,16px);
  background:var(--grad-gold);color:#0a1c14;font-family:var(--sans);font-weight:600;font-size:1rem;
  padding:.95em 1.4em;border-radius:100px}
.menu-mail{margin-top:auto;font-size:.94rem;color:rgba(236,228,212,.6);transition:color .25s}
.menu-mail:hover{color:var(--gold-2)}

/* содержимое всплывает лестницей, а не едет одной плитой */
.menu-head,.menu-cta,.menu-mail,.menu-col{opacity:0;transform:translateY(14px);
  transition:opacity .3s var(--ease-out),transform .3s var(--ease-out)}
.menu[open] .menu-head,.menu[open] .menu-cta,.menu[open] .menu-mail,.menu[open] .menu-col{
  opacity:1;transform:none;transition-duration:.34s;transition-timing-function:var(--ease)}
.menu[open] .menu-head{transition-delay:40ms}
.menu[open] .menu-col:nth-child(1){transition-delay:90ms}
.menu[open] .menu-col:nth-child(2){transition-delay:130ms}
.menu[open] .menu-col:nth-child(3){transition-delay:170ms}
.menu[open] .menu-cta{transition-delay:200ms}
.menu[open] .menu-mail{transition-delay:230ms}

@media(max-width:860px){
  .burger{display:grid;place-items:center}
  .nav-back{display:none}
}
@media (prefers-reduced-motion:reduce){
  .menu,.menu[open],.menu::backdrop,.menu[open]::backdrop,
  .menu-head,.menu-cta,.menu-mail,.menu-col,.menu-col a,.menu-close{transition:none}
  .menu-head,.menu-cta,.menu-mail,.menu-col{opacity:1;transform:none}
}

/* footer */
.foot{background:var(--g900);color:rgba(236,228,212,.72);padding:clamp(44px,6.5vw,80px) 0 26px}
.article+.foot{margin-top:clamp(40px,6vw,72px)}
.foot-top{display:grid;grid-template-columns:1fr;gap:clamp(26px,4vw,46px);
  padding-bottom:clamp(28px,4vw,42px);border-bottom:1px solid var(--line-d)}
@media(min-width:820px){.foot-top{grid-template-columns:minmax(210px,1fr) 2.1fr;gap:clamp(44px,5vw,80px)}}
.foot .brand{color:var(--cream);margin-bottom:.5em}
.foot .brand .mark{color:var(--gold-2)}
.foot .brand-ar{font-family:var(--arab);direction:rtl;color:var(--gold-2);font-size:1rem;opacity:.9;margin-left:.15em}
.foot p{font-size:.94rem;max-width:40ch}
.foot-meta{display:flex;flex-direction:column;margin-top:.9em}
.foot-meta a{font-size:.94rem;padding:.42em 0;transition:color .3s,padding-left .3s var(--ease)}
.foot-meta a:hover{color:var(--gold-2);padding-left:4px}
.foot-nav{display:grid;grid-template-columns:1fr;gap:clamp(18px,3vw,32px)}
@media(min-width:560px){.foot-nav{grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,34px)}}
.foot-col h3{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-2);
  margin-bottom:.65em;font-weight:700;font-family:var(--sans)}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:0}
.foot ul a{display:block;font-size:.94rem;padding:.42em 0;transition:color .3s,padding-left .3s var(--ease)}
.foot ul a:hover{color:var(--gold-2);padding-left:4px}
@media(max-width:559px){
  .foot-col{border-top:1px solid var(--line-d);padding-top:clamp(16px,3.5vw,26px)}
  .foot-col:first-child{border-top:0;padding-top:0}
}
.foot-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:center;
  padding-top:26px;font-size:.85rem;color:rgba(236,228,212,.62)}
.foot-bot .ar{font-family:var(--arab);direction:rtl;color:var(--gold-2);font-size:1.15rem}
@media (prefers-reduced-motion:reduce){.foot-meta a,.foot ul a{transition:none}}