/* =========================================================
   TYPOGRAPHY — HIKKARU (Elementor-safe)
   Классы ставим на виджет/контейнер: t-h1, t-body-md и т.д.
   ========================================================= */

/* ---------- Headings (Elementor Heading widget) ---------- */
.elementor .t-h1 .elementor-heading-title{
  font-family: var(--ff-base) !important;
  font-size: var(--fs-h1) !important;
  line-height: var(--lh-h1) !important;
}

.elementor .t-h2 .elementor-heading-title{
  font-family: var(--ff-base) !important;
  font-size: var(--fs-h2) !important;
  line-height: var(--lh-h2) !important;
}

.elementor .t-h3 .elementor-heading-title{
  font-family: var(--ff-base) !important;
  font-size: var(--fs-h3) !important;
  line-height: var(--lh-h3) !important;
}

.elementor .t-h3{
  font-family: var(--ff-base) !important;
  font-size: var(--fs-h3) !important;
  line-height: var(--lh-h3) !important;
}

.elementor .t-h4 .elementor-heading-title{
  font-family: var(--ff-base) !important;
  font-size: var(--fs-h4) !important;
  line-height: var(--lh-h4) !important;
}

.elementor .t-h5 .elementor-heading-title{
  font-family: var(--ff-base) !important;
  font-size: var(--fs-h5) !important;
  line-height: var(--lh-h5) !important;
}

/* Если вдруг класс вешают не на Heading-виджет, а на контейнер вокруг заголовка */
.elementor .t-h1 :is(h1,h2,h3,h4,h5,h6),
.elementor .t-h2 :is(h1,h2,h3,h4,h5,h6),
.elementor .t-h3 :is(h1,h2,h3,h4,h5,h6),
.elementor .t-h4 :is(h1,h2,h3,h4,h5,h6),
.elementor .t-h5 :is(h1,h2,h3,h4,h5,h6){
  font-family: var(--ff-base) !important;
}

/* ---------- Subtitles (универсально: для Heading и для текста) ---------- */
.elementor .t-sub2-med :is(.elementor-heading-title, .elementor-widget-container, p, li){
  font-family: var(--ff-base) !important;
  font-size: var(--fs-h5) !important;
  line-height: var(--lh-h5) !important;
  font-weight: 500 !important;
}

.elementor .t-sub2-reg :is(.elementor-heading-title, .elementor-widget-container, p, li){
  font-family: var(--ff-base) !important;
  font-size: var(--fs-sub2-30reg) !important;
  line-height: var(--lh-sub2-30reg) !important;
  font-weight: 400 !important;
}

.elementor .t-sub3-med :is(.elementor-heading-title, .elementor-widget-container, p, li){
  font-family: var(--ff-base) !important;
  font-size: var(--fs-sub3-24med) !important;
  line-height: var(--lh-sub3-24med) !important;
  font-weight: 500 !important;
}

.elementor .t-sub3-reg :is(.elementor-heading-title, .elementor-widget-container, p, li){
  font-family: var(--ff-base) !important;
  font-size: var(--fs-sub3-24reg) !important;
  line-height: var(--lh-sub3-24reg) !important;
  font-weight: 400 !important;
}

/* ---------- Body text (Text Editor / Icon List / etc.) ---------- */
/* Важно: Text Editor обычно задаёт стили на p, поэтому прописываем и контейнер, и вложенные */
.elementor .t-body-xl :is(.elementor-widget-container, p, li){
  font-family: var(--ff-base) !important;
  font-size: var(--fs-body4-64reg) !important;
  line-height: var(--lh-body4-64reg) !important;
}

.elementor .t-body-lg :is(.elementor-widget-container, p, li){
  font-family: var(--ff-base) !important;
  font-size: var(--fs-p) !important;
  line-height: var(--lh-p) !important;
}

.elementor .t-body-md :is(.elementor-widget-container, p, li){
  font-family: var(--ff-base) !important;
  font-size: var(--fs-body2-18reg) !important;
  line-height: var(--lh-body2-18reg) !important;
}

.elementor .t-body-sm :is(.elementor-widget-container, p, li){
  font-family: var(--ff-base) !important;
  font-size: var(--fs-body3-16reg) !important;
  line-height: var(--lh-body3-16reg) !important;
}

/* ---------- Buttons (если нужно) ---------- */
.elementor .t-btn :is(.elementor-button, .elementor-button-text){
  font-family: var(--ff-base) !important;
  /* сюда можно подставить свои переменные для кнопок */
}

/* ---------- Weight helpers ---------- */
.elementor .fw-400 { font-weight: 400 !important; }
.elementor .fw-500 { font-weight: 500 !important; }
.elementor .fw-600 { font-weight: 600 !important; }
.elementor .fw-700 { font-weight: 700 !important; }

/* =========================
   BORDER RADIUS
   ========================= */

.elementor .bord-rad-17-16{
  border-radius: var(--br-17-16) !important;
}

/* =========================
   PADDING
   ========================= */
   
/*поля серых карточек*/
.elementor .pad-17-26{
  padding: var(--pad-17-26-y) var(--pad-17-26-x) !important;
}

.elementor-element .pad-17-26 > :where(p, span, ul, ol){
  margin-bottom: 0 !important;
  padding: 0!important;
  display: block;
}

/* =========================
   SECTION PADDING (X)
   ========================= */

.elementor .pad-sec-x{
  padding-left: var(--pad-sec-x) !important;
  padding-right: var(--pad-sec-x) !important;
}

/* =========================
   SECTION COLUMNS GAP
   ========================= */

.elementor .gap-sec-cols{
  column-gap: var(--gap-sec-cols) !important;
  gap: var(--gap-sec-cols) !important;
}
