/*
Theme Name:   Kadence Child — oneSatori
Theme URI:    https://onesatori.com
Description:  Child theme za oneSatori web. Sav custom CSS je ovdje — ne u bazi.
Author:       oneSatori
Template:     kadence
Version:      1.0.0
*/

/*
=============================================================
  DESIGN SYSTEM — SEMANTIC COLOR TOKENS
=============================================================
  color-bg-dark      #1a1535  palette7   Hero dark, tamne sekcije
  color-bg-light     #e3f4f0  palette9   Light sekcije
  color-bg-warm      #f7f3ef  palette8   About, warm sekcije
  color-accent       #6b5ce7  palette1   CTA primary
  color-accent-dark  #5a4dd6  palette2   CTA hover
  color-teal         #2a9d84  palette10  Brand teal (logo, ikone)
  color-teal-dark    #1a6e5e  palette11  Teal darker variant
  color-text-primary #1c1a2b  palette3   Body tekst na svjetlim bg
  color-text-sub     #4a4660  palette4   Supporting tekst
  color-text-on-dark #ffffff  palette6   Tekst na tamnim bg
  color-highlight    #9a92ff  palette5   Tags, eyebrow, social ikone

  TIPOGRAFIJA: sve Montserrat
  H1 Hero:       52px / 600 / lh 1.15
  H2 Primary:    40px / 600 / lh 1.2
  H2 Secondary:  28px / 600 / lh 1.25
  H3 Card:       22px / 600 / lh 1.3
  Eyebrow/tag:   13px / 500 / uppercase / ls 1.5px
  Body:          17px / 400 / lh 1.75
  Body small:    15px / 400 / lh 1.7
=============================================================
*/


/* ============================================================
   1. GLOBAL — Font rendering & smooth scroll
   ============================================================ */

html {
  scroll-behavior: smooth;
}

body, body * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}


/* ============================================================
   2. TIPOGRAFIJA — Heading letter-spacing & line-height
   ============================================================ */

h1.wp-block-kadence-advancedheading,
h2.wp-block-kadence-advancedheading {
  letter-spacing: -0.02em;
}

/* Body tekst u Kadence paragrafima */
.wp-block-kadence-advancedheading[data-kb-block] p,
.kt-adv-heading p {
  line-height: 1.75;
}


/* ============================================================
   3. NAVIGACIJA & FOOTER — Smooth hover transitions
   ============================================================ */

.main-navigation a,
.primary-menu a,
header nav a {
  transition: color 0.2s ease, opacity 0.2s ease;
}

.kt-blocks-accordion-header {
  transition: background-color 0.2s ease, color 0.2s ease;
}

.site-footer a {
  transition: color 0.2s ease, opacity 0.2s ease;
}


/* ============================================================
   4. BUTTONI — Globalni transition
   ============================================================ */

.kt-button {
  transition: background-color 0.25s ease, color 0.25s ease,
              transform 0.2s ease, box-shadow 0.25s ease,
              border-color 0.25s ease;
}

.kt-button:hover {
  transform: translateY(-2px);
}

/* Secondary (outline) buttoni — transparent pozadina, purple border i tekst */
.kb-btn27_759008-90,
.kb-btn27_reiki-btns1,
.kb-btn27_os-btns1,
.kb-btn107_sbtn-bridge,
.kb-btn111_stoje-btns1,
.kb-btn111_inic-btns1,
.kb-btn245_sbtn-crosssell,
.kb-btn245_sbtn-daljinu,
.kb-btn313_108987-92,
.kb-btn107_donate-btn,
.kb-btn1014_donate-btn {
  background-color: transparent !important;
  color: var(--global-palette1) !important;
  border: 2px solid var(--global-palette1) !important;
}

.kb-btn27_759008-90:hover,
.kb-btn27_reiki-btns1:hover,
.kb-btn27_os-btns1:hover,
.kb-btn107_sbtn-bridge:hover,
.kb-btn111_stoje-btns1:hover,
.kb-btn111_inic-btns1:hover,
.kb-btn245_sbtn-crosssell:hover,
.kb-btn245_sbtn-daljinu:hover,
.kb-btn313_108987-92:hover,
.kb-btn107_donate-btn:hover,
.kb-btn1014_donate-btn:hover {
  background-color: var(--global-palette1) !important;
  color: var(--global-palette6) !important;
  border-color: var(--global-palette1) !important;
}

/* Secondary buttoni — dekorativni > arrow (van bordera) */
.kb-btn27_759008-90,
.kb-btn27_reiki-btns1,
.kb-btn27_os-btns1,
.kb-btn107_sbtn-bridge,
.kb-btn111_stoje-btns1,
.kb-btn111_inic-btns1,
.kb-btn245_sbtn-crosssell,
.kb-btn245_sbtn-daljinu,
.kb-btn313_108987-92,
.kb-btn1009_529540-31,
.kb-btn1009_070c10-f8,
.kb-btn1009_b09003-7c,
.kb-btn1018_54a68d-80,
.kb-btn1014_67cb35-71,
.kb-btn107_donate-btn,
.kb-btn1014_donate-btn {
  position: relative !important;
  overflow: visible !important;
}

.kb-btn27_759008-90::after,
.kb-btn27_reiki-btns1::after,
.kb-btn27_os-btns1::after,
.kb-btn107_sbtn-bridge::after,
.kb-btn111_stoje-btns1::after,
.kb-btn111_inic-btns1::after,
.kb-btn245_sbtn-crosssell::after,
.kb-btn245_sbtn-daljinu::after,
.kb-btn313_108987-92::after,
.kb-btn1009_529540-31::after,
.kb-btn1009_070c10-f8::after,
.kb-btn1009_b09003-7c::after,
.kb-btn1018_54a68d-80::after,
.kb-btn1014_67cb35-71::after,
.kb-btn107_donate-btn::after,
.kb-btn1014_donate-btn::after {
  content: ">";
  position: absolute;
  right: -18px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--global-palette1);
  font-size: 13px;
  font-weight: 400;
  transition: opacity 0.25s ease;
}

.kb-btn27_759008-90:hover::after,
.kb-btn27_reiki-btns1:hover::after,
.kb-btn27_os-btns1:hover::after,
.kb-btn107_sbtn-bridge:hover::after,
.kb-btn111_stoje-btns1:hover::after,
.kb-btn111_inic-btns1:hover::after,
.kb-btn245_sbtn-crosssell:hover::after,
.kb-btn245_sbtn-daljinu:hover::after,
.kb-btn313_108987-92:hover::after,
.kb-btn1009_529540-31:hover::after,
.kb-btn1009_070c10-f8:hover::after,
.kb-btn1009_b09003-7c:hover::after,
.kb-btn1018_54a68d-80:hover::after,
.kb-btn1014_67cb35-71:hover::after,
.kb-btn107_donate-btn:hover::after,
.kb-btn1014_donate-btn:hover::after {
  opacity: 0;
}


/* ============================================================
   5. IMAGE TRETMAN — Border-radius konzistentnost & hover
   ============================================================ */

.wp-block-kadence-image .kb-img {
  transition: transform 0.4s ease;
}

.wp-block-kadence-image:hover .kb-img {
  transform: scale(1.02);
}


/* ============================================================
   6. INFOBOX KARTICE — Hover lift
   ============================================================ */

.kt-blocks-info-box-link-wrap,
.kt-blocks-info-box {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.kt-blocks-info-box-link-wrap:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 36px rgba(26, 21, 53, 0.1) !important;
}


/* ============================================================
   7. IMAGE CARDS (oneSatori page) — Hover + responsive visina
   ============================================================ */

/* Responsive visina umjesto fiksnih 540px */
.kb-section-has-link.kb-section-has-overlay {
  min-height: 400px !important;
  height: auto !important;
}

/* Card hover — scale + shadow lift */
.kb-section-has-link {
  transition: transform 0.25s ease, box-shadow 0.3s ease;
  cursor: pointer;
}

.kb-section-has-link:hover {
  transform: translateY(-4px) scale(1.01);
  box-shadow: 0 16px 40px rgba(26, 21, 53, 0.18) !important;
}


/* ============================================================
   8. WAVE SEPARATOR — Subpixel gap fix
   ============================================================ */

.kt-shape-divider,
.kt-shape-divider svg {
  display: block;
  line-height: 0;
}

.kt-row-layout-inner > .kt-shape-divider.kt-shape-divider-top {
  margin-top: -2px;
}

.kt-row-layout-inner > .kt-shape-divider.kt-shape-divider-bottom {
  margin-bottom: -2px;
}

/* Ukloni stray borders na sekcijama */
.wp-block-kadence-rowlayout,
.kt-row-layout-inner {
  border-top: none !important;
  border-bottom: none !important;
}


/* ============================================================
   9. HOMEPAGE — Hero (ID: 27)
   ============================================================ */

/* Hero: puna visina viewporta */
.kb-row-layout-id27_rl-hero-v3 {
  min-height: 100vh !important;
  align-items: center !important;
  box-sizing: border-box !important;
}


/* ============================================================
   10. HOMEPAGE — About sekcija (ID: 27)
   ============================================================ */

/* About: kompaktniji padding */
.kb-row-layout-id27_rl-about {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

/* About slika */
.kadence-column27_col-about-img .kb-img {
  max-width: 340px !important;
  width: 100% !important;
  border-radius: 20px !important;
  display: block !important;
}

/* About name: H2 secondary na tamnoj podlozi */
.kt-adv-heading27_about-name {
  font-size: 28px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}

/* About bio tekst */
.kt-adv-heading27_about-bio {
  font-size: 16px !important;
  line-height: 1.7 !important;
  font-weight: 400 !important;
}

/* About vertikalno centriranje teksta */
.kadence-column27_col-about-text > .kt-inside-inner-col {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  height: 100% !important;
}


/* ============================================================
   11. HOMEPAGE — Reiki sekcija (ID: 27) — simetričan padding
   ============================================================ */

.kb-row-layout-id27_rl-reiki {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}


/* ============================================================
   12. HOMEPAGE — oneSatori sekcija (ID: 27)
   ============================================================ */

.kb-row-layout-id27_rl-onesatori {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}

/* oneSatori desc text — WCAG AA contrast fix */
.kt-adv-heading27_os-desc,
.kt-adv-heading27_os-desc2 {
  color: #1c1a2b !important;
  font-weight: 400 !important;
}


/* ============================================================
   13. ONESATORI PAGE — Community sekcija (ID: 107)
   ============================================================ */

.kb-row-layout-id107_rl-community {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

/* Community: osiguraj bijeli tekst na tamnoj pozadini */
.kb-row-layout-id107_rl-community .wp-block-kadence-advancedheading,
.kb-row-layout-id107_rl-community p {
  color: #ffffff !important;
}

/* Cards sekcija: padding */
.kb-row-layout-id107_rl-cards {
  padding-bottom: 80px !important;
}


/* ============================================================
   14. REIKI INICIJACIJA — Dark row bijeli tekst (ID: 313)
   ============================================================ */

.kb-row-layout-id313_daabd1-c7 .wp-block-kadence-advancedheading,
.kb-row-layout-id313_daabd1-c7 p {
  color: #ffffff !important;
}

/* Button spacing */
.kb-btns313_222873-7b {
  margin-top: 32px !important;
}


/* ============================================================
   15. KONTAKT STRANICA — Custom HTML layout CSS (ID: 109)
   ============================================================ */

.satori-contact-wrap {
  display: grid;
  grid-template-columns: 65fr 35fr;
  min-height: calc(100vh - 80px);
}

.satori-contact-left {
  background: #1a1535;
  padding: 80px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.satori-contact-left-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  max-width: 520px;
}

.satori-contact-h1 {
  font-size: clamp(44px, 5vw, 76px);
  line-height: 1.0;
  color: #ffffff;
  font-weight: 700;
  margin: 0 0 20px 0;
  font-family: 'Montserrat', sans-serif;
  letter-spacing: -1.5px;
}

.satori-contact-subtitle {
  font-size: 16px;
  line-height: 1.8;
  color: #f5f7ff;
  opacity: 0.7;
  margin: 0 0 32px 0;
  font-family: 'Montserrat', sans-serif;
}

.satori-contact-divider {
  width: 44px;
  height: 1px;
  background: #9a92ff;
  margin-bottom: 32px;
  opacity: 0.45;
}

.satori-contact-ctas {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
}

.satori-contact-wa-btn {
  display: inline-block;
  background: #9a92ff;
  color: #1a1535 !important;
  padding: 15px 38px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none !important;
  font-family: 'Montserrat', sans-serif;
  letter-spacing: 0.3px;
  transition: background 0.25s ease, color 0.25s ease,
              transform 0.2s ease, box-shadow 0.25s ease;
  box-shadow: 0 2px 12px rgba(154, 146, 255, 0.18);
}

.satori-contact-wa-btn:hover {
  background: #2a9d84;
  color: #ffffff !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 18px rgba(42, 157, 132, 0.25);
}

.satori-contact-email {
  font-size: 14px;
  color: #f5f7ff !important;
  text-decoration: none !important;
  opacity: 0.45;
  font-family: 'Montserrat', sans-serif;
  transition: opacity 0.2s ease;
  padding-left: 4px;
}

.satori-contact-email:hover {
  opacity: 1;
}

/* Kontakt right panel */
.satori-contact-right {
  background:
    radial-gradient(ellipse at 35% 40%, rgba(255,255,255,0.22) 0%, transparent 60%),
    linear-gradient(150deg, #aaa3ff 0%, #9a92ff 55%, #8880f2 100%);
  padding: 64px 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}

.satori-contact-right::after {
  content: '';
  position: absolute;
  bottom: -280px;
  right: -280px;
  width: 680px;
  height: 680px;
  border-radius: 50%;
  border: 1px solid rgba(26, 21, 53, 0.14);
  pointer-events: none;
}

.satori-contact-quote-inner {
  position: relative;
  z-index: 1;
  width: 100%;
}

.satori-contact-quote-inner::before {
  content: '';
  display: block;
  width: 32px;
  height: 2px;
  background: #1a1535;
  opacity: 0.2;
  margin-bottom: 24px;
}

.satori-contact-quote-text {
  font-size: clamp(22px, 2.8vw, 34px);
  line-height: 1.55;
  color: #1a1535;
  font-style: normal;
  font-weight: 500;
  margin: 0;
  font-family: 'Montserrat', sans-serif;
}

/* Kontakt plain email link */
.satori-plain-link {
  text-decoration: none !important;
  opacity: 0.75;
}

.satori-plain-link:hover {
  opacity: 1;
  text-decoration: underline !important;
}

/* Kontakt responsive */
@media (min-width: 769px) and (max-width: 1100px) {
  .satori-contact-left  { padding: 64px 48px; }
  .satori-contact-right { padding: 56px 40px; }
}

@media (max-width: 768px) {
  .satori-contact-wrap      { grid-template-columns: 1fr; min-height: auto; }
  .satori-contact-left      { padding: 56px 28px; align-items: flex-start; }
  .satori-contact-left-main { max-width: 100%; }
  .satori-contact-right     { padding: 56px 28px; min-height: 280px; }
}


/* ============================================================
   16. FOOTER — Navigacija i opći stil
   ============================================================ */

/* Footer nav link hover */
.footer-html-wrap a,
.footer-widget a,
.site-footer a {
  opacity: 0.8;
  transition: opacity 0.2s ease, color 0.2s ease;
}

.footer-html-wrap a:hover,
.footer-widget a:hover,
.site-footer a:hover {
  opacity: 1;
}

/* Footer column label (palette5 eyebrow stil) */
.kt-adv-headingfooter-col-usluge,
.kt-adv-headingfooter-col-onas {
  letter-spacing: 1.5px;
  margin-bottom: 12px !important;
}

/* Footer tagline */
.kt-adv-heading17ce98-73 {
  font-size: 14px !important;
  line-height: 1.6 !important;
  opacity: 0.7;
  margin-top: 10px !important;
}

/* Footer logo max-width */
.footer-widget .wp-block-image img {
  max-width: 140px !important;
  height: auto !important;
}

/* Footer bottom bar — tekst veličina */
.footer-html-wrap p,
.footer-html-wrap .wp-block-paragraph {
  font-size: 13px !important;
  opacity: 0.6;
}


/* ============================================================
   17. BLOG — Related posts usklađivanje
   ============================================================ */

/* Makni bijeli gap ispod related posts */
.single .entry-related,
.single .entry-related:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.single .content-wrap,
.single #primary,
.single .site-main {
  padding-bottom: 0 !important;
}

.single article.single-entry {
  margin-bottom: 0 !important;
}

.single .content-area {
  margin-bottom: 0 !important;
}


/* ============================================================
   18. MOBILE — centriranje slika u stacked kolonama
   ============================================================ */

/* Fix: kb-image-ratio-sq nema padding-bottom CSS (za razliku od kb-image-ratio-square) */
.kb-image-ratio-sq {
  height: 0;
  overflow: hidden;
  padding-bottom: 100%;
  position: relative;
}

@media (max-width: 767px) {
  .kadence-column111_col-tretman-img .kt-inside-inner-col,
  .kadence-column111_col-daljinu-img .kt-inside-inner-col,
  .kadence-column111_col-inic-img .kt-inside-inner-col {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  .kadence-column111_col-tretman-img figure.wp-block-kadence-image,
  .kadence-column111_col-daljinu-img figure.wp-block-kadence-image,
  .kadence-column111_col-inic-img figure.wp-block-kadence-image {
    width: 100% !important;
  }
}


/* ============================================================
   16. DONACIJA STRANICA
   ============================================================ */

/* ============================================================
   17. EN FOOTER
   ============================================================ */
.lang-en #colophon { display: none !important; }