/* =========================
   FirstLine styles (Full)
   ========================= */


/* FirstLine: glowing section heading like top cards */
.fl-heading-glow,
.fl-heading-glow .kt-adv-heading {
  position: relative;
  display: inline-block;
  margin: 0 auto 18px;
  padding-bottom: 14px;

  color: #F2F4F7;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.1;

  /* subtle glow */
  text-shadow:
    0 0 14px rgba(201, 162, 74, 0.22),
    0 2px 0 rgba(0, 0, 0, 0.35);
}

/* gold glow underline */
.fl-heading-glow::after,
.fl-heading-glow .kt-adv-heading::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: min(320px, 85%);
  height: 2px;
  border-radius: 999px;

  background: linear-gradient(
    90deg,
    rgba(201, 162, 74, 0),
    rgba(201, 162, 74, 0.95),
    rgba(201, 162, 74, 0)
  );

  box-shadow:
    0 0 16px rgba(201, 162, 74, 0.55),
    0 0 28px rgba(201, 162, 74, 0.25);
}

/* optional: soft top highlight like a “shine” */
.fl-heading-glow::before,
.fl-heading-glow .kt-adv-heading::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -10px;
  transform: translateX(-50%);
  width: min(420px, 92%);
  height: 1px;
  border-radius: 999px;

  background: linear-gradient(
    90deg,
    rgba(201, 162, 74, 0),
    rgba(201, 162, 74, 0.35),
    rgba(201, 162, 74, 0)
  );
  opacity: 0.65;
}

/* responsive tuning */
@media (max-width: 768px) {
  .fl-heading-glow,
  .fl-heading-glow .kt-adv-heading {
    letter-spacing: 0.08em;
  }
  .fl-heading-glow::after,
  .fl-heading-glow .kt-adv-heading::after {
    width: min(260px, 90%);
  }
}


/* Make paragraphs look like clickable rows (even without links yet) */
.problem-links p{
  margin: 0 !important;
  padding: 12px 14px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  border-radius: 14px;
  border: 1px solid rgba(201,162,74,.35);
  background: rgba(11,15,20,.55);

  color: #F2F4F7;
  cursor: default; /* пока нет ссылок — не делаем "руку" */
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

/* right arrow */
.problem-links p::after{
  content: "→";
  color: rgba(201,162,74,.95);
  margin-left: 14px;
  font-size: 18px;
  line-height: 1;
  transition: transform .16s ease;
}

/* hover effect (works now) */
.problem-links p:hover{
  border-color: rgba(201,162,74,.75);
  box-shadow: 0 0 0 1px rgba(201,162,74,.25), 0 0 26px rgba(201,162,74,.10);
  background: rgba(11,15,20,.70);
  transform: translateY(-1px);
}
.problem-links p:hover::after{
  transform: translateX(3px);
}


/* Clean hover like "BOOK ONLINE" */
.fl-gold-btn .kt-button,
.fl-gold-btn .kb-button{
  transition: box-shadow .18s ease, filter .18s ease;
}

.fl-gold-btn:hover .kt-button,
.fl-gold-btn:hover .kb-button{
  /* без рамок, без after, без scale */
  filter: brightness(1.03);
  box-shadow:
    0 14px 34px rgba(0,0,0,.35),
    0 0 34px rgba(201,162,74,.28);
}

/* ===== FORCE CLEAN HOVER FOR fl-gold-btn ===== */

/* 1) Reset everything that could cause the "double frame / weird box" */
.fl-gold-btn,
.fl-gold-btn *{
  transform: none !important;
  outline: none !important;
}

.fl-gold-btn::before,
.fl-gold-btn::after,
.fl-gold-btn *::before,
.fl-gold-btn *::after{
  content: none !important;
  box-shadow: none !important;
}

/* 2) Make sure glow isn't clipped */
.fl-gold-btn,
.fl-gold-btn .kt-button,
.fl-gold-btn .kb-button{
  overflow: visible !important;
}

/* 3) Apply glow to the REAL button element (covers both cases) */
.fl-gold-btn:hover .kt-button,
.fl-gold-btn:hover .kb-button,
.fl-gold-btn.kt-button:hover,
.fl-gold-btn.kb-button:hover{
  box-shadow:
    0 14px 34px rgba(0,0,0,.35),
    0 0 38px rgba(201,162,74,.35) !important;
  filter: brightness(1.03) !important;
}

/* ===== TOP ICON BUTTONS: hover только на наведенную кнопку ===== */
.fl-top-icons .kt-button,
.fl-top-icons .kb-button{
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
  will-change: transform;
}

/* КЛЮЧ: hover на самой кнопке, не на контейнере -> не будет “две сразу” */
.fl-top-icons .kt-button:hover,
.fl-top-icons .kb-button:hover{
  transform: translateY(-1px) scale(1.04);
  filter: brightness(1.06);
  box-shadow:
    0 14px 34px rgba(0,0,0,.35),
    0 0 42px rgba(201,162,74,.40);
}

/* ===== BLOG BUTTON: такой же эффект (и точно будет увеличиваться) ===== */
.fl-blog-btn .kt-button,
.fl-blog-btn .kb-button{
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
  will-change: transform;
}

.fl-blog-btn .kt-button:hover,
.fl-blog-btn .kb-button:hover{
  transform: translateY(-1px) scale(1.03);
  filter: brightness(1.06);
  box-shadow:
    0 14px 34px rgba(0,0,0,.35),
    0 0 38px rgba(201,162,74,.38);
}

/* ===== BLOG BUTTON: force hover (Kadence + Gutenberg + link) ===== */
.fl-blog-btn,
.fl-blog-btn *{
  transform: none; /* на случай старых reset'ов */
}

.fl-blog-btn .kt-button,
.fl-blog-btn .kb-button,
.fl-blog-btn .wp-block-button__link,
.fl-blog-btn a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
  will-change: transform;
}

.fl-blog-btn .kt-button:hover,
.fl-blog-btn .kb-button:hover,
.fl-blog-btn .wp-block-button__link:hover,
.fl-blog-btn a:hover{
  transform: translateY(-1px) scale(1.03) !important;
  filter: brightness(1.06) !important;
  box-shadow:
    0 14px 34px rgba(0,0,0,.35),
    0 0 38px rgba(201,162,74,.38) !important;
}

/* === Dropdown hover fix + new colors === */

/* чуть меньше жирность */
#primary-menu .sub-menu a{
  font-weight: 500;              /* было 600 */
}

/* чтобы hover-плашка была ровно по размеру ссылки */
#primary-menu .sub-menu li > a{
  display: block;                /* важно */
  width: 100%;                   /* чтобы занимало всю строку */
  box-sizing: border-box;
}

/* hover: gold bg + black text */
#primary-menu .sub-menu a:hover,
#primary-menu .sub-menu li.current-menu-item > a{
  background: #C9A24A;           /* gold */
  color: #0B0F14;                /* black */
  transform: none;               /* убираем сдвиг, если не нужен */
}

/* убираем старые эффекты, если они мешают */
#primary-menu .sub-menu a:hover{
  box-shadow: none;
}

/* Make Brands dropdown wider (no color changes) */
#primary-menu .sub-menu{
  min-width: 340px;     /* попробуй 360–460 */
  width: 340px;         /* фиксированная ширина, чтобы не сжималось */
}

/* чтобы пункты не ломали ширину/не сжимались */
#primary-menu .sub-menu a{
  white-space: normal;  /* пусть переносит, если нужно */
}

/* Mobile typography tighten (Kadence/WordPress) */
@media (max-width: 768px){

  /* общий текст в контенте страниц */
  .entry-content, .wp-site-blocks, .site-content{
    font-size: 15px;       /* было условно 16-18 */
    line-height: 1.45;     /* было 1.6-1.8 */
  }

  /* параграфы внутри контента */
  .entry-content p{
    margin-bottom: 0.6em;  /* уменьшили “воздух” между абзацами */
  }

  /* списки */
  .entry-content ul, .entry-content ol{
    margin-bottom: 0.7em;
    padding-left: 1.1em;
  }
}

/* =========================
   FIX: Sticky header goes behind hero/cover
   (Kadence)
   ========================= */

/* базовый слой хидера */
#masthead,
.site-header,
header.site-header{
  position: relative;
  z-index: 99999 !important;
}

/* Kadence sticky wrapper (когда прилипает) */
#masthead .kadence-sticky-header{
  z-index: 999999 !important;
}

/* иногда Kadence фиксирует inner/wrap — поднимем и их */
#masthead .site-header-wrap,
#masthead .site-header-inner{
  position: relative;
  z-index: 999999 !important;
}

/* если сверху WP admin bar */
.admin-bar #masthead{
  top: 32px;
}