/* ytrend — общие стили лендинга (шапка, дропдаун, кнопки, футер).
   Подключается на index.html и всех фич-страницах. Правки чейнджей здесь — едины везде. */

:root{ --yt-accent:#C46A4A; --yt-ink:#15110F; --yt-muted:#707070; }

/* ===== Шапка (ff-topbar) ===== */
/* Блюр топбара вынесен в ::before, а НЕ на сам .ff-topbar: backdrop-filter на топбаре «съедал»
   blur вложенной панели дропдауна (она его потомок). Псевдоэлемент не предок панели → блюрят оба. */
/* line-height:normal — иначе высота шапки зависит от line-height страницы-хоста
   (plan.html: body line-height:1.5 → кнопки выше; index: normal). Пинуем для паритета. */
.ff-topbar{position:fixed;top:0;left:0;right:0;z-index:120;background:transparent;border-bottom:1px solid rgba(0,0,0,.07);line-height:normal}
.ff-topbar::before{content:'';position:absolute;inset:0;z-index:-1;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(16px) saturate(180%);backdrop-filter:blur(16px) saturate(180%)}
.ff-topbar-inner{max-width:1280px;margin:0 auto;padding:15px 24px;display:flex;align-items:center;gap:8px}
.ff-topbar .ff-logo{display:inline-flex;align-items:center;color:var(--yt-ink)}
.ff-logo-lockup{height:26px;width:auto;display:block}
.ff-topbar .ff-menu{display:flex;align-items:center;gap:2px;margin-left:auto}
.ff-topbar .ff-menu-link{font-size:13.5px;color:rgba(20,18,16,.62);text-decoration:none;padding:8px 14px;border-radius:999px;transition:color .14s,background .14s}
.ff-topbar .ff-menu-link:hover{color:var(--yt-ink);background:rgba(0,0,0,.05)}
.ff-topbar .ff-nav-actions{display:flex;align-items:center;gap:8px;margin-left:8px}
.ff-topbar .ff-link{font-size:13.5px;color:rgba(20,18,16,.7);text-decoration:none;padding:8px 14px;border-radius:999px;transition:background .14s,color .14s}
.ff-topbar .ff-link:hover{background:rgba(0,0,0,.05);color:var(--yt-ink)}
.ff-topbar .ff-cta{font-size:13.5px;font-weight:600;color:#fff;background:var(--yt-accent);text-decoration:none;padding:9px 16px;border-radius:999px;transition:opacity .14s}
.ff-topbar .ff-cta:hover{opacity:.9}
@media(max-width:860px){.ff-topbar .ff-menu,.ff-topbar .ff-link{display:none}.ff-topbar-inner{padding:10px 16px;gap:12px}}

/* ===== Дропдаун «Возможности» (по наведению) ===== */
.ff-nav-dd{position:relative}
.ff-nav-dd-btn{display:inline-flex;align-items:center;gap:5px;font-size:13.5px;color:rgba(20,18,16,.62);background:transparent;border:none;cursor:pointer;padding:8px 14px;border-radius:999px;transition:background .14s,color .14s;font-family:inherit}
.ff-nav-dd-btn:hover{color:var(--yt-ink);background:rgba(0,0,0,.05)}
/* Пока дропдаун открыт — кнопка остаётся активной (как Resources у Linear), даже когда курсор в списке */
.ff-nav-dd:hover .ff-nav-dd-btn,.ff-nav-dd:focus-within .ff-nav-dd-btn{color:var(--yt-ink);background:rgba(0,0,0,.05)}
.ff-nav-dd-chev{width:14px;height:14px;opacity:.8;transition:transform .18s}
.ff-nav-dd-panel{position:absolute;top:calc(100% + 20px);left:0;z-index:130;width:480px;max-width:calc(100vw - 32px);display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:10px;border-radius:16px;background:rgba(255,255,255,.6);-webkit-backdrop-filter:blur(30px) saturate(180%);backdrop-filter:blur(30px) saturate(180%);border:1px solid rgba(0,0,0,.08);box-shadow:0 22px 60px rgba(0,0,0,.14);opacity:0;transform:translateY(-6px);visibility:hidden;isolation:isolate;transition:opacity .17s,transform .17s,visibility .17s}
/* Мостик от кнопки к панели — только под кнопкой (не 480px, иначе ловит ховер под соседними пунктами) */
.ff-nav-dd::after{content:'';position:absolute;top:100%;left:0;width:100%;height:24px}
.ff-nav-dd:hover .ff-nav-dd-panel,.ff-nav-dd:focus-within .ff-nav-dd-panel{opacity:1;transform:translateY(0);visibility:visible}
.ff-nav-dd:hover .ff-nav-dd-chev,.ff-nav-dd:focus-within .ff-nav-dd-chev{transform:rotate(180deg)}
.ff-dd-item{display:flex;align-items:flex-start;gap:10px;padding:10px 11px;border-radius:11px;text-decoration:none;transition:background .14s}
.ff-dd-item:hover{background:rgba(0,0,0,.05)}
.ff-dd-item.is-soon{opacity:.5;cursor:default}
.ff-dd-item.is-soon:hover{background:transparent}
.ff-dd-ic{flex-shrink:0;line-height:1;color:var(--yt-accent)}
.ff-dd-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.ff-dd-t{font-size:13.5px;font-weight:600;color:var(--yt-ink)}
.ff-dd-d{font-size:11.5px;line-height:1.35;color:rgba(20,18,16,.55)}
.ff-dd-soon{display:inline-block;margin-left:6px;font-size:9.5px;font-weight:700;letter-spacing:.04em;color:var(--yt-accent);background:rgba(196,106,74,.12);padding:1px 6px;border-radius:999px;vertical-align:1px}
/* Нижняя строка дропдауна «Все возможности →» (на всю ширину панели) */
.ff-dd-foot{grid-column:1/-1;display:flex;align-items:center;gap:6px;margin-top:4px;padding:11px;border-top:1px solid rgba(0,0,0,.06);border-radius:9px;text-decoration:none;font-size:13px;font-weight:600;color:var(--yt-accent);transition:background .14s}
.ff-dd-foot:hover{background:rgba(196,106,74,.07)}
.ff-dd-foot-arr{transition:transform .15s}
.ff-dd-foot:hover .ff-dd-foot-arr{transform:translateX(3px)}

/* ===== Общая кнопка (hero/CTA фич-страниц) ===== */
.btn{display:inline-flex;align-items:center;background:var(--yt-accent);color:#fff;text-decoration:none;font-weight:600;font-size:14.5px;padding:13px 28px;border-radius:999px;transition:transform .15s ease,box-shadow .15s ease}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(196,106,74,.30)}

/* ===== Единый футер ===== */
.site-foot{border-top:1px solid rgba(15,15,15,.07);background:#F7F7F5;padding:44px 0;font-size:13px;color:var(--yt-muted)}
.site-foot-in{max-width:1160px;margin:0 auto;padding:0 24px;display:flex;flex-direction:column;gap:14px}
.site-foot-req{line-height:1.7}
.site-foot-links{display:flex;gap:18px;flex-wrap:wrap}
.site-foot a{color:var(--yt-muted);text-decoration:none}
.site-foot a:hover{color:var(--yt-accent)}
.site-foot-pay,.site-foot-copy{color:#9A9A9A}
.yt-fill{background:rgba(199,144,40,.14);color:#C79028;padding:0 4px;border-radius:3px}