/* Страница завода: hero с логотипом, «О заводе», сетка категорий, строка «как заказать».
   Данные — src/data/factories-about.json, категории — из нашего каталога. */

/* Свой контейнер: страница завода рендерится вне Astra-обёртки. */
.bb-fwrap{width:100%;max-width:1320px;margin:0 auto;padding-left:32px;padding-right:32px}
@media (max-width:640px){ .bb-fwrap{padding-left:16px;padding-right:16px} }

/* ---------- hero ---------- */
.bb-fhero{position:relative;background:var(--color-charcoal);color:#fff;overflow:hidden}
.bb-fhero::before{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(900px 480px at 80% 16%,rgba(226,43,43,.2),transparent 62%),
             radial-gradient(700px 420px at 10% 96%,rgba(169,184,154,.1),transparent 60%)}
.bb-fhero__inner{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 440px;
  gap:48px;align-items:center;min-height:clamp(400px,44vh,520px);
  padding-top:48px;padding-bottom:48px}
.bb-fhero__eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.bb-fhero__eyebrow::before{content:'';width:22px;height:1px;background:var(--color-primary)}
.bb-fhero h1{color:#fff;margin:16px 0 0;font-size:clamp(2rem,3.4vw,3rem);letter-spacing:-.02em;line-height:1.1}
.bb-fhero__lead{margin:16px 0 0;max-width:620px;font-size:17px;line-height:1.6;color:rgba(255,255,255,.74)}

.bb-flogo{position:relative;height:372px;display:flex;align-items:center;justify-content:center;padding-bottom:26px}
.bb-flogo::before{content:'';position:absolute;inset:8% 4%;border:1px solid rgba(255,255,255,.1);border-radius:20px}
/* плашка обтягивает логотип: ни белых полей, ни пустых углов */
.bb-flogo__plate{position:relative;background:#fff;border-radius:22px;padding:20px;
  box-shadow:0 24px 60px rgba(0,0,0,.36);display:flex;align-items:center;justify-content:center}
.bb-flogo__plate img{display:block;width:auto;height:auto;max-width:280px;max-height:280px}
.bb-flogo__caption{position:absolute;bottom:0;left:50%;transform:translateX(-50%);white-space:nowrap;
  font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5)}

/* ---------- о заводе ---------- */
.bb-fabout{padding:56px 0}
.bb-fabout__row{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);gap:48px;align-items:start}
.bb-fabout h2{margin:0 0 16px;font-size:clamp(1.5rem,2.4vw,2rem)}
.bb-fabout p{margin:0 0 16px;font-size:17px;line-height:1.65;max-width:680px;color:var(--color-text)}
.bb-fabout p:last-of-type{margin-bottom:0}

.bb-ffacts{list-style:none;margin:0;padding:20px;border:1px solid var(--color-border);
  border-radius:14px;background:#fff;display:grid;gap:16px}
.bb-ffacts li{display:grid;gap:2px;padding-bottom:16px;border-bottom:1px solid var(--color-border)}
.bb-ffacts li:last-child{padding-bottom:0;border-bottom:none}
.bb-ffacts dt{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-muted)}
.bb-ffacts dd{margin:0;font-size:15px}

/* ---------- категории ---------- */
.bb-fcats{padding-bottom:56px}
.bb-fcats__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:24px}
.bb-fcats__head h2{margin:0;font-size:clamp(1.5rem,2.4vw,2rem)}
/* у части заводов в контракте два H1 — второй стоит заголовком секции */
.bb-fcats__title{margin:0;font-family:var(--font-heading);font-weight:800;
  font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.15;letter-spacing:-.01em}
.bb-fcats__head p{margin:8px 0 0;font-size:16px;color:var(--color-text-muted)}
.bb-fcats__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;
  list-style:none;margin:0;padding:0}
.bb-fcat{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid var(--color-border);
  border-radius:14px;overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.bb-fcat:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(42,31,26,.09)}
.bb-fcat:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px}
.bb-fcat__media{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;padding:16px;background:#fff}
.bb-fcat__media img{max-height:100%;width:auto;object-fit:contain}
.bb-fcat__body{padding:16px 16px 20px;display:flex;flex-direction:column;gap:4px}
.bb-fcat__name{font-family:var(--font-heading);font-weight:700;font-size:16px;line-height:1.3}
.bb-fcat__count{font-size:13px;color:var(--color-text-muted)}

/* ---------- как заказать ---------- */
.bb-forder{border-top:1px solid var(--color-border);background:var(--color-cream-deep);padding:24px 0}
.bb-forder__row{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.bb-forder__title{font-family:var(--font-heading);font-weight:700;font-size:17px}
.bb-forder__links{display:flex;gap:24px;flex-wrap:wrap;font-size:15px}
.bb-forder__links a{display:inline-flex;align-items:center;gap:6px;color:var(--color-primary);
  font-weight:600;text-decoration:none}
.bb-forder__links a:hover{color:var(--color-primary-hover)}

@media (max-width:1024px){
  .bb-fhero__inner{grid-template-columns:1fr;min-height:0;padding-top:32px;padding-bottom:40px}
  /* логотип завода остаётся и на телефоне: компактная плашка над заголовком */
  .bb-flogo{order:-1;height:auto;padding:0;margin-bottom:22px;justify-content:flex-start}
  .bb-flogo::before{display:none}
  .bb-flogo__plate{padding:8px;border-radius:16px;box-shadow:0 12px 28px rgba(0,0,0,.32)}
  .bb-flogo__plate img{max-width:92px;max-height:92px}
  .bb-flogo__caption{display:none}
  .bb-fabout{padding:40px 0}
  .bb-fabout__row{grid-template-columns:1fr;gap:28px}
  .bb-fcats__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  /* На телефоне две колонки: в одну получается 14 экранов прокрутки */
  .bb-fcats__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .bb-fcat__body{padding:10px 12px 12px}
  .bb-fcat__name{font-size:14px}
  .bb-fcat__count{font-size:12px}
  .bb-forder__row{flex-direction:column;align-items:flex-start;gap:14px}
  .bb-forder__links{gap:14px;flex-direction:column}
}