/*
 * forma-ui.css: единые компоненты card-042 (fc-btn, шкала заголовков, секция, карточка, чип, ссылка).
 * Не генерируется build-home.cjs: править руками. Порядок подключения: shared → components → ui → site (functions.php, preview-server.cjs).
 * Значения только var(--fc-*): без литералов цвета, без px и rgba. Таблица соответствия старых классов: project/cards/card-042/mapping.md.
 */

/* Кнопка fc-btn: вариант glow (= .glow-pill.sm), outline (= .fc-tg-btn), plain (= .lm-btn), join (= .community-join); размеры sm/md/default/lg */
.fc-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--fc-space-8);height:var(--fc-btn-h);padding:0 var(--fc-btn-pad-x);border:var(--fc-btn-border) solid var(--fc-btn-edge);border-radius:var(--fc-btn-radius);background:var(--fc-btn-bg);color:var(--fc-color-btn-text);font-size:var(--fc-text-sm);font-weight:500;line-height:1;text-decoration:none;cursor:pointer;transition:box-shadow .35s var(--fc-ease),transform .35s var(--fc-ease),background .35s,border-color .3s}
.fc-btn .fc-ico{width:var(--fc-icon-sm);height:var(--fc-icon-sm)}
.fc-btn:focus-visible{outline:var(--fc-focus-w) solid var(--fc-focus-color);outline-offset:var(--fc-focus-offset)}
.fc-btn--glow{position:relative;overflow:hidden;border-width:var(--fc-bw-strong);border-color:var(--fc-color-edge-glow);background:var(--fc-color-bg-glow);box-shadow:var(--fc-btn-shadow)}
.fc-btn--glow::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,var(--fc-clear) 30%,var(--fc-mix-sheen) 50%,var(--fc-clear) 70%);transform:translateX(-120%);transition:transform .8s var(--fc-ease);pointer-events:none}
.fc-btn--glow:hover{background:var(--fc-color-bg-glow-hover);border-color:var(--fc-color-edge-glow-hover);box-shadow:var(--fc-btn-shadow-hover);transform:translateY(calc(var(--fc-fx-1)*-1))}
.fc-btn--glow:hover::after{transform:translateX(120%)}
.fc-btn--outline{padding:0 var(--fc-space-20);background:var(--fc-clear);border-color:var(--fc-color-accent);color:var(--fc-color-btn-text);box-shadow:none;font-weight:inherit;line-height:inherit}
.fc-btn--outline:hover{box-shadow:var(--fc-shadow-outline-hover)}
.fc-btn--outline.is-soon{border-width:var(--fc-bw-hair);border-style:dashed;border-color:var(--fc-color-line-soft);color:var(--fc-color-muted);cursor:default;box-shadow:none}
.fc-btn--plain{padding:0 var(--fc-space-24);border:0;background:var(--fc-clear);box-shadow:none;color:var(--fc-color-text-strong);font-size:var(--fc-text-md);gap:var(--fc-space-8)}
.fc-btn--join{height:auto;min-height:var(--fc-community-h);padding:var(--fc-space-16) var(--fc-space-24);gap:var(--fc-space-24);border-width:var(--fc-hairline);border-color:var(--fc-color-join);background:var(--fc-color-join);color:var(--fc-color-on-join);box-shadow:none;overflow:visible}
.fc-btn--join:hover{background:var(--fc-color-join-hover);box-shadow:var(--fc-shadow-join-hover);transform:translateY(calc(var(--fc-fx-2)*-1))}
.fc-btn--join:focus-visible{outline:var(--fc-focus-w) solid var(--fc-color-focus-join);outline-offset:var(--fc-focus-offset-6)}
.fc-btn--sm{height:var(--fc-btn-h-sm)}
.fc-btn--md{height:var(--fc-btn-h-md)}
.fc-btn--lg{height:var(--fc-btn-h-lg)}
@media (max-width:767px){.fc-btn--join{min-height:var(--fc-join-h-mobile)}}

/* Шкала заголовков */
.fc-ttl-1{font-size:clamp(var(--fc-text-34),5.4vw,var(--fc-text-60));font-weight:400;line-height:1.05;letter-spacing:-.02em}
.fc-ttl-2{font-size:clamp(var(--fc-text-24),2.6vw,var(--fc-text-30));font-weight:300;letter-spacing:-.01em;color:var(--fc-color-text-strong)}
.fc-ttl-3{font-size:var(--fc-text-20);font-weight:400;line-height:1.3;letter-spacing:-.005em;color:var(--fc-color-text-strong)}
.fc-ttl-4{font-size:var(--fc-text-lg);font-weight:400;line-height:1.35;color:var(--fc-color-text-strong)}

/* Секция */
.fc-sec{padding-block:0 var(--fc-space-64)}

/* Карточка */
.fc-card-x{display:flex;flex-direction:column;width:100%;overflow:hidden;border:var(--fc-hairline) solid var(--fc-card-line);border-radius:var(--fc-card-radius);background:var(--fc-card-bg);transition:border-color .3s}
.fc-card-x:hover{border-color:var(--fc-mix-card-edge)}
.fc-card-x-media{position:relative;height:var(--fc-card-media-h);overflow:hidden}
.fc-card-x-body{display:flex;flex:1;flex-direction:column;padding:var(--fc-space-24)}

/* Чип рубрики */
.fc-chip-x{display:inline-block;padding:var(--fc-space-6) var(--fc-space-12);border:var(--fc-hairline) solid var(--fc-color-glow);border-radius:var(--fc-radius-pill);background:var(--fc-mix-chip-bg);-webkit-backdrop-filter:blur(var(--fc-fx-8));backdrop-filter:blur(var(--fc-fx-8));font-size:var(--fc-text-xs);letter-spacing:.16em;text-transform:uppercase;color:var(--fc-color-accent)}

/* Ссылка */
.fc-link-x{font-size:var(--fc-text-sm);color:var(--fc-color-link);border-bottom:var(--fc-hairline) solid var(--fc-color-line-soft);padding-bottom:var(--fc-fx-2);transition:color .3s,border-color .3s}
.fc-link-x:hover{color:var(--fc-color-text-strong);border-color:var(--fc-color-accent)}

/* Акцентный заголовок и рукописная вставка (card-113, второй уровень для лендингов; плотные страницы — .fc-h2) */
.fc-display{margin:0;font-weight:var(--fc-weight-display);font-size:var(--fc-text-display);line-height:1.1;letter-spacing:-.02em;color:var(--fc-color-text-strong)}
.fc-display-sm{font-size:var(--fc-text-display-sm)}
.fc-display em{font-style:normal;background:var(--fc-grad-accent);-webkit-background-clip:text;background-clip:text;color:transparent}
.fc-script{--fc-script-c:var(--fc-color-hand-amber);font-family:var(--ff-hand);font-weight:600;font-size:var(--fs-hand);line-height:1.05;color:var(--fc-script-c);display:inline-flex;align-items:flex-end;gap:.35rem;transform:rotate(-5deg);transform-origin:left center;text-shadow:0 0 18px color-mix(in srgb,var(--fc-script-c) 35%,transparent);margin:0}
.fc-script svg{width:2.4rem;height:2.4rem;flex:none;margin-bottom:-.6rem;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.fc-script--mint{--fc-script-c:var(--fc-color-hand-mint)}
.fc-script--lav{--fc-script-c:var(--fc-color-hand-lav)}
.fc-script--flat{transform:rotate(-3deg)}
a.fc-script,a.fc-script:visited{color:var(--fc-script-c);text-decoration:none;transition:filter .3s,transform .3s}a.fc-script:hover{filter:brightness(1.2);transform:rotate(-5deg) translateX(.2rem)}
@media(max-width:600px){.fc-script{font-size:1.5rem}}
