/* BoltCad — Типографическая спецификация по макету “DESIGN”
   Семейства подключены через Adobe Fonts (Typekit):
   --font-head: "futura-pt";  --font-ui: "aglet-sans".
   Этот файл фиксирует точные размеры из макета и размечает блоки.

   Легенда блоков:
   [K]  — Kicker / верхние малые метки (BOLTCAD GROUP, категории)
   [H1] — Главный заголовок (INDUSTRIAL- UND CORPORATE DESIGN)
   [L]  — Лид‑текст под героем
   [S1] — Малый серый подзаголовок (DESIGNKONZEPTION & -ENTWICKLUNG)
   [H2] — Раздел “ENTWURF UND KOMMUNIKATION”
   [P]  — Основной текст раздела (абзацный)
   [ST] — Крупные проценты (45% / 64% / 100%)
   [SC] — Подписи к процентам
   [SEC]— Ярлык секции “Projektbeispiele”
   [CT] — Заголовки карточек (проекты)
   [CN] — Малые подписи/метки в карточках (AUTOMOTIV, INSTRUMENTE и т.п.)
   [CTA]— Кнопка “RENDERING GALERIE”
   [F]  — Футер (колонки ссылок, копирайт)
*/

:root {
  /* Базовые семейства (из подключенного Adobe Fonts) */
  --font-ui: "aglet-sans", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif;
  --font-head: "futura-pt", "aglet-sans", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif;

  /* ---- Точные размеры из макета (px) ---- */
  --fs-kicker: clamp(1.07rem, 1rem + .30vw, 1.08rem);     /* [K] малые метки, CAPS */
  --fs-h1: clamp(2.3rem, 2.2rem + 1.2vw, 2.5rem);      /* [H1] основной заголовок (Heavy) */
  --fs-lead:   clamp(2.05rem, 1.95rem + .50vw, 2.1667rem);     /* [L] лид под героем (Light) */
  --fs-s1:     clamp(.72rem, .66rem + .30vw, .75rem);     /* [S1] малый серый подзаголовок CAPS */
  --fs-h21:     clamp(2.4rem, 2.35rem + 3.2vw, 2.45rem);    /* [H2] подзаголовок раздела (Heavy) */
  --fs-h2:     clamp(2rem, 1.9rem + 3.2vw, 2.05rem);    /* [H2] подзаголовок раздела (Heavy) */
  --fs-h3:     clamp(1.75rem, 1.7rem + 3.2vw, 1.8rem);    /* [H2] подзаголовок раздела (Heavy) */
  --fs-h4: 		clamp(1.3rem, 1.2rem + 3.2vw, 1.35rem);
  --fs-copy:   clamp(1.4rem, 1.08rem + .2vw, 1.5rem);     /* [P] основной абзац (Light) */
  --fs-stat:   clamp(2rem, 1.9rem + 2.5vw, 2.5rem);     /* [ST] крупные проценты (Heavy) */
  --fs-scap:   clamp(1.175rem, 1.12rem + .30vw, 1.2167rem);     /* [SC] подписи к статистике (Light) */
  --fs-sec:    clamp(2.9rem, 2.88rem + .2vw, 3rem);    /* [SEC] ярлык “Projektbeispiele” (семейство head, Bold) */
  --fs-card:   clamp(1.2rem, 1.2rem + .50vw, 1.4rem);     /* [CT] заголовок карточки (Bold) */
  --fs-cnote:  clamp(1.22rem, 1.20rem + .30vw, 1.25rem);     /* [CN] маленькие подписи/метки */
  --fs-cta:    clamp(1.3rem, 1.36rem + .30vw, 1.3167rem);     /* [CTA] текст на кнопке (Aglet Sans, Bold, CAPS) */
  --fs-foot:   clamp(1.05rem, 1.02rem + .20vw, 1.075rem);    /* [F] футерные ссылки и копирайт */

  /* Межстрочные и кернинг */
  --lh-h1:   1.05;
  --lh-lead: 1.65;
  --lh-h2:   1.20;
  --lh-p:    1.40;
  --lh-stat: 1.00;
  --lh-scap: 1.40;
  --lh-card: 1.25;
  --lh-foot: 1.40;

  /* Прочее */
  --tracking-caps: 0.12em;  /* для Kicker/малых капсов  0.08em*/
  --tracking-cta:  0.02em;  /* для кнопок */
}

@media (max-width: 768px) {
  :root {
	    --fs-h1:     clamp(2.5rem, 2.1rem + 1.2vw, 2.5rem);      /* [H1] основной заголовок (Heavy) */
		--fs-h2:     clamp(1.8rem, 1.7rem + 3.2vw, 1.85rem);    /* [H2] подзаголовок раздела (Heavy) */
		--fs-kicker: clamp(1.27rem, 1.2rem + .30vw, 1.28rem);
		--fs-sec: clamp(1.8rem, 1.78rem + .2vw, 1.8rem);
  }
}
/* ===================== */
/* [K] Kicker / малые метки */
.kicker1 {
  font-family: var(--font-ui);
  font-weight: 400; /* Regular */
  font-size: var(--fs-kicker)!important;
  line-height: 1.2;
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
   color: var(--blackC);
}

/* ===================== */
/* [H1] Главный заголовок */
.h1,
h1.section-title {
  font-family: var(--font-head);
  font-weight: 700; /* Heavy */
  font-size: var(--fs-h1)!important;
  line-height: var(--lh-h1);
  text-transform: uppercase;
}
/* Акцентное слово внутри H1 (CORPORATE DESIGN) — Medium */
.h1 .accent { font-weight: 500; }
.section-title .accent{color:var(--brandC);}

/* ===================== */
/* [L] Лид под героем */
.lead {
  font-family: var(--font-head);
  font-weight: 300; /* Light */
  font-size: var(--fs-copy)!important;
  line-height: var(--lh-lead);
}

/* ===================== */
/* [S1] Малый серый подзаголовок */
.small-label {
  font-family: var(--font-head);
  font-weight: 700; /* Bold */
  font-size: var(--fs-s1)!important;
  line-height: 1.2;
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
}

/* ===================== */
/* [H2] Подзаголовок раздела */
.h2,
h2.section-title {
  font-family: var(--font-head);
  font-weight: 800; /* Heavy */
  font-size: var(--fs-h2)!important;
  line-height: var(--lh-h2);
  text-transform: uppercase;
  line-height: var(--lh-lead);
  margin: 10px 0;
}
/*.why h2.section-title,
.vision-product h2.section-title {
    font-family: var(--font-head);
    font-weight: 800;
    font-size: var(--fs-h21) !important;
    line-height: var(--lh-h2);
    text-transform: uppercase;
}*/

h3.section-title {
    font-family: var(--font-head);
    font-weight: 800;
    font-size: var(--fs-h3) !important;
    line-height: var(--lh-h2);
    text-transform: uppercase;
}

h4.section-title {
    font-family: var(--font-head);
    font-weight: 800;
    font-size: var(--fs-h4) !important;
    line-height: var(--lh-h2);
    text-transform: uppercase;
}



/* ===================== */
/* [P] Основной текст раздела */
.copy {
  font-family: var(--font-head);
  font-weight: 300; /* Light */
  font-size: var(--fs-copy)!important;
  line-height: var(--lh-p);
}

.about p {
font-family: var(--font-head);
  font-weight: 300; /* Light */
  font-size: var(--fs-copy)!important;
  line-height: var(--lh-p);
}
/* .cta-box.invrel .body p {
font-family: var(--font-head);
  font-weight: 300;  
  font-size: var(--fs-copy)!important;
  line-height: var(--lh-p);
}*/
/* ===================== */
/* [ST] Крупные проценты */
.stat_num {
  font-family: var(--font-head);
  font-weight: 800; /* Heavy */
  font-size: var(--fs-stat)!important;
  line-height: var(--lh-stat);
}
/* [SC] Подписи под статой */
.stat_caption {
  font-family: var(--font-head);
  font-weight: 300; /* Light */
  font-size: var(--fs-scap)!important;
  line-height: var(--lh-scap);
}

/* ===================== */
/* [SEC] Ярлык “Projektbeispiele” */
.section-chip {
  font-family: var(--font-ui);
  font-weight: 500; /* Bold */
  font-size: var(--fs-sec)!important;
  line-height: 1.2;
}

/* ===================== */
/* Карточки проектов */
/* [CT] Заголовок карточки */
.card-title, .news-card .title  {
  font-family: var(--font-head);
  font-weight: 700; /* Bold */
  font-size: var(--fs-card)!important;
  line-height: var(--lh-card);
}
/* [CN] Малые подписи/метки в карточках */
.news-card .card-note,
.news-card .card-tag  {
  font-family: var(--font-head);
  font-weight: 300; /* Light */
  font-size: var(--fs-cnote)!important;
  line-height: 1.2;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.news-card .extra {
  font-family: var(--font-head);
  font-weight: 300; /* Light */
  font-size: var(--fs-cnote)!important;
  line-height: 1.2;
  letter-spacing: 0.02em;
 
}
.sol-card .desc {
   font-family: var(--font-head);
  font-weight: 300; /* Light */
  font-size: var(--fs-cnote)!important;
  line-height: 1.2;
  letter-spacing: 0.02em;
  margin-top: 8px;
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 0.22s ease, max-height 0.22s ease;
}
/* ===================== */
/* [CTA] Кнопка “RENDERING GALERIE” */
.btn-ren {
  font-family: var(--font-ui);
  font-weight: 700; /* Bold */
  font-size: var(--fs-cta)!important;
  letter-spacing: var(--tracking-cta);
  text-transform: uppercase;
}

/* ===================== */
/* [F] Футер */
.footer-small, .footbar, .fcol,
.footer a,
.footer .legal {
  font-family: var(--font-head);
  font-weight: 300; /* Light */
  font-size: var(--fs-foot)!important;
  line-height: var(--lh-foot);
}

/* ====== Примеры разметки (для ориентира) ======
<h6 class="kicker">BOLTCAD GROUP</h6>                      // [K]
<h1 class="h1">INDUSTRIAL- UND <span class="accent">CORPORATE DESIGN</span></h1>  // [H1]
<p class="lead">Platzieren Sie Ihr Produkt ...</p>       // [L]
<p class="small-label">DESIGNKONZEPTION & -ENTWICKLUNG</p> // [S1]
<h2 class="h2">ENTWURF UND KOMMUNIKATION</h2>            // [H2]
<p class="copy">Im Entwurf wird definiert, was es noch nicht gibt...</p> // [P]
<div class="stat">45%</div> <p class="stat-caption">Gestiegener Absatz ...</p> // [ST] + [SC]
<div class="section-chip">Projektbeispiele</div>            // [SEC]
<h3 class="card-title">Designkonzeptionen für diverse PKW Interieur Appliances</h3> // [CT]
<p class="card-note">AUTOMOTIV</p>                         // [CN]
<a class="btn" href="#">RENDERING GALERIE</a>               // [CTA]
<footer class="footer"><a>Über bolcad Group</a> ...</footer> // [F]
*/