/* =====================================================================
   "У фокусі" — дизайн-система, напрямок C «Сучасний глянець»
   Фуксія #C43D72 · слива #2B2540 · ніч #171419 · сніг #FBFBFD
   Заголовки: Space Grotesk · Текст: Inter
   Перевизначає CSS-змінні Kadence (!important гарантує пріоритет
   незалежно від порядку інлайн-CSS Kadence) + точкові компоненти.
   ===================================================================== */

:root {
  /* ---- палітра C, мапнута на семантику Kadence ---- */
  --global-palette1:  #c43d72 !important;  /* акцент / фуксія        */
  --global-palette2:  #2b2540 !important;  /* акцент-2 / слива       */
  --global-palette3:  #171419 !important;  /* найтемніший текст/ніч  */
  --global-palette4:  #211d27 !important;  /* заголовки              */
  --global-palette5:  #3a353f !important;  /* основний текст         */
  --global-palette6:  #7a7580 !important;  /* приглушений текст      */
  --global-palette7:  #f2eff5 !important;  /* легкий фон (лілова)     */
  --global-palette8:  #f8f6fb !important;  /* світліший фон          */
  --global-palette9:  #ffffff !important;  /* білий / базовий фон     */
  --global-palette-highlight:      #c43d72 !important;
  --global-palette-highlight-alt:  #f2eff5 !important;
  --global-palette-btn:            #c43d72 !important;
  --global-palette-btn-hover:      #a82f5f !important;

  --global-body-font-family:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
  --global-heading-font-family: 'Space Grotesk', 'Inter', system-ui, sans-serif !important;

  /* ---- власні токени C ---- */
  --uf-fuchsia:  #c43d72;
  --uf-fuchsia-d:#a82f5f;
  --uf-night:    #171419;
  --uf-plum:     #2b2540;
  --uf-snow:     #fbfbfd;
  --uf-muted:    #7a7580;
  --uf-line:     #eceaf0;
  --uf-radius:   14px;
  --uf-pill:     999px;
}

/* ---- база ---- */
body {
  background-color: var(--uf-snow);
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: #3a353f;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.entry-title, .site-title, .widget-title, .kadence-title {
  font-family: 'Space Grotesk', 'Inter', system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--uf-night);
  text-wrap: balance;
}
h1, .entry-title { letter-spacing: -0.03em; }

::selection { background: var(--uf-fuchsia); color: #fff; }

/* ---- посилання ---- */
a { color: var(--uf-fuchsia); }
a:hover, a:focus { color: var(--uf-fuchsia-d); }
.entry-content a:not(.button):not(.wp-block-button__link) {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(196, 61, 114, .4);
}

/* ---- кнопки: пігулки ---- */
.wp-block-button__link,
.button, button.button, input[type="submit"],
.kb-button, .kadence-btn, .kt-button,
.wp-element-button {
  background-color: var(--uf-fuchsia);
  color: #fff;
  border-radius: var(--uf-pill) !important;
  border: 0;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 0.7em 1.6em;
  transition: transform .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.wp-block-button__link:hover,
.button:hover, button.button:hover, input[type="submit"]:hover,
.kb-button:hover, .wp-element-button:hover {
  background-color: var(--uf-fuchsia-d);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(196, 61, 114, .28);
}
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--uf-fuchsia);
  box-shadow: inset 0 0 0 2px var(--uf-fuchsia);
}

/* ---- шапка сайту ---- */
.site-title a { color: var(--uf-night); }
.site-header-row .header-navigation .header-menu-container ul li.menu-item > a:hover {
  color: var(--uf-fuchsia);
}
.header-navigation a { font-weight: 500; }

/* ---- сітка карток архіву/блогу ---- */
.loop-entry.content-bg,
article.loop-entry,
.content-bg.loop-entry {
  background: #fff;
  border: 1px solid var(--uf-line);
  border-radius: var(--uf-radius);
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(30, 20, 40, .05);
  transition: transform .18s ease, box-shadow .18s ease;
}
.loop-entry.content-bg:hover,
article.loop-entry:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 34px rgba(30, 20, 40, .12);
}
.loop-entry .post-thumbnail img,
.loop-entry .article-post-thumbnail img { transition: transform .3s ease; }
.loop-entry:hover .post-thumbnail img { transform: scale(1.04); }

.loop-entry .entry-title { font-size: 1.28rem; line-height: 1.22; }
.loop-entry .entry-title a { color: var(--uf-night); }
.loop-entry .entry-title a:hover { color: var(--uf-fuchsia); }

/* ---- бейджі рубрик / таксономії ---- */
.entry-taxonomies a,
.loop-entry .category-style-normal .entry-taxonomies-categories a,
.entry-meta .category a {
  display: inline-block;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--uf-fuchsia);
}

/* ---- hero-утиліта (для головної / секцій) ---- */
.uf-hero {
  background: linear-gradient(120deg, #1c1826 0%, #2b2540 58%, #3a2340 100%);
  color: #fff;
  border-radius: 20px;
  padding: clamp(32px, 6vw, 72px);
}
.uf-hero h1, .uf-hero h2 { color: #fff; }
.uf-hero p { color: #c9c3d4; }
.uf-hero .uf-eyebrow { color: #f19cc0; }
.uf-eyebrow {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--uf-fuchsia);
}

/* ---- медичний дисклеймер (YMYL-гілки) ---- */
.uf-med-disclaimer {
  margin: 2.5rem 0 0;
  padding: 16px 18px;
  border-left: 3px solid var(--uf-fuchsia);
  background: var(--uf-palette8, #f8f6fb);
  border-radius: 0 8px 8px 0;
  font-size: 0.9rem;
  line-height: 1.55;
  color: var(--uf-muted);
}
.uf-med-disclaimer strong { color: var(--uf-night); }

/* ---- головна: сховати банер-заголовок сторінки (hero сам собі титул) ---- */
.home .entry-hero-container-inner,
.home .page-hero-section,
.home .entry-hero,
.home header.entry-header .entry-title,
.home .kadence-breadcrumbs { display: none !important; }
.home .content-area { padding-top: 2rem; }

/* ---- фокус-стан (доступність) ---- */
a:focus-visible, button:focus-visible,
.wp-block-button__link:focus-visible, input:focus-visible {
  outline: 2px solid var(--uf-fuchsia);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
  .loop-entry:hover { transform: none; }
}