/* fnmo.ai · меню шапки (19.10.2026): Creative / Websites / Apps / AI Agents + выпадашки с кейсами, мобильное меню.
   Стиль — как у живой шапки: моно-капс 10px, подчёркивание градиентом, тёмное стекло. */
.fnav{display:flex;align-items:center;gap:clamp(14px,1.9vw,30px);justify-self:center}
.fnav-i{position:relative}
.fnav-a{display:block;font-family:var(--mno);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);
 padding:6px 0;position:relative;white-space:nowrap;transition:color .25s}
.fnav-a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--grad);transition:right .35s cubic-bezier(.2,.8,.2,1)}
.fnav-i:hover .fnav-a,.fnav-i:focus-within .fnav-a,.fnav-i.on .fnav-a{color:var(--ink)}
/* наведение — только белеет текст; градиентная черта — только у активного пункта */
.fnav-i.on .fnav-a::after{right:0}
.fnav-sep{width:1px;height:14px;background:rgba(255,255,255,.18)}
html[lang="ru"] .fnav-a{letter-spacing:.12em}

.fnav-dd{position:absolute;left:-18px;top:100%;padding-top:14px;opacity:0;visibility:hidden;transform:translateY(-4px);
 transition:opacity .2s ease,transform .25s cubic-bezier(.2,.8,.2,1),visibility 0s .25s}
.fnav-i:hover .fnav-dd,.fnav-i:focus-within .fnav-dd{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.fnav-p{display:flex;flex-direction:column;min-width:210px;padding:8px;border-radius:16px;border:1px solid rgba(255,255,255,.12);
 background:rgba(9,9,16,.9);backdrop-filter:saturate(180%) blur(22px);-webkit-backdrop-filter:saturate(180%) blur(22px);
 box-shadow:0 24px 50px -20px #000}
.fnav-s{font-family:var(--mno);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);
 padding:11px 12px;border-radius:10px;white-space:nowrap;transition:color .2s,background .2s}
.fnav-s:hover,.fnav-s:focus-visible{color:var(--ink);background:rgba(255,255,255,.06)}
@media(max-width:1000px){.fnav{display:none}}

/* курсор «Scroll» не налезает на меню: в шапке и мобильном меню — обычная стрелка/рука */
@media (pointer:fine){
 header,#mob{cursor:default}
 header a,header button,#mob a,#mob button{cursor:pointer}
 body.fn-inhead #cur,body.fn-inhead #dot{opacity:0!important}
}

/* мобильное меню — четыре направления крупно, кейсы и категории строкой под каждым */
body.fn-mob{overflow:hidden}
body.fn-mob header{z-index:90;background:#05050A}
body.fn-mob #mob{background:#05050A}
#mob .fnm{width:100%;max-width:520px;margin:0 auto;display:flex;flex-direction:column;text-align:left}
#mob .fnm-g{display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:10px;padding:16px 0 14px;border-top:1px solid rgba(255,255,255,.1)}
#mob .fnm-n{font-family:var(--mno);font-size:10px;letter-spacing:.18em;color:var(--dim);padding-top:9px}
#mob .fnm-a{font-family:var(--dsp);font-style:italic;font-weight:700;text-transform:uppercase;font-size:clamp(30px,9vw,44px);
 line-height:1;color:var(--ink);letter-spacing:-.01em}
#mob .fnm-g.on .fnm-a{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.06em}
#mob .fnm-g.on .fnm-n{color:var(--ink)}
#mob .fnm-s{grid-column:2;display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:9px}
#mob .fnm-s:empty{display:none}
#mob .fnm-s a,#mob .fnm-x a{font-family:var(--mno);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);padding:6px 0}
#mob .fnm-x{display:flex;flex-wrap:wrap;gap:4px 20px;padding:18px 0 4px;border-top:1px solid rgba(255,255,255,.1)}
#mob .fnm-x a{color:var(--ink)}
#mob .fnm-cta{margin-top:20px;align-self:stretch;font-family:var(--mno);font-style:normal;font-weight:400;font-size:11px;letter-spacing:.18em;
 text-transform:uppercase;color:#fff;background:var(--grad);border:0;border-radius:980px;min-height:52px;line-height:1}
@media(max-width:1000px){
 #mob{display:none;align-items:stretch;justify-content:flex-start;padding:84px var(--pad) 40px}
 #mob.on{display:flex}
}

/* одна шапка на всех страницах: на телефоне слева лого, справа WhatsApp, EN/RU, Menu */
@media(max-width:1000px){header{grid-template-columns:auto 1fr}}

/* страницы направлений и кейсов: шапка главной 1:1 (head.css), здесь — только мобильное меню */
#mob:not(.on){display:none}
body.sp #mob{position:fixed;inset:0;z-index:80;background:#05050A;flex-direction:column;overflow:auto}
body.sp #mob.on{display:flex}