/* Kalendar (/kalendar) — bela sekcija sajta, krupnija slova; sve klase počinju sa kk- */
.kk, .kk-detalj {
  --kk-tekst: #111;
  --kk-soft: #3a3a3a;
  --kk-muted: #6b6b6b;
  --kk-ivica: #e4e4e4;
  --kk-mint: #2c8c86;
  --kk-blush: #c0625a;
  --kk-blush-jak: #e88f86;
  --kk-crvena: #d9534a;
  --kk-bela: #b8b0a0;
  --kk-plava: #3d7fcf;
  --kk-zuta: #dcae22;
  --kk-gap: #2f9e5a;
  --kk-mesec: #f1c84b;
  --kk-senka: #e9ecec;
  --kk-grad: linear-gradient(120deg, #a8e6e2, #f7c5c0);
  --kk-grad-soft: linear-gradient(120deg, #e3f6f4 0%, #fcebe9 100%);
  --kk-r: 18px;
  color: var(--kk-tekst);
  font-size: 1.12rem;
  line-height: 1.6;
}
.kk h1, .kk h2, .kk h3, .kk-detalj h2, .kk-detalj h3 { margin: 0; line-height: 1.15; text-wrap: balance; }
.kk p, .kk-detalj p { margin: 0; }
.kk button, .kk-detalj button { font: inherit; color: inherit; }
.kk .eyebrow { font-size: .82rem; }
.kk-h2 { font-weight: 700; font-style: italic; font-size: clamp(1.6rem, 3.2vw, 2.2rem); margin: 4px 0 16px !important; }

/* ---------- Naslov strane i listanje meseci ---------- */
.kk-naslov { font-family: var(--f-title); font-weight: 400; font-size: clamp(2rem, 4.4vw, 2.8rem); letter-spacing: .04em;
  background: linear-gradient(100deg, #111 0%, #111 55%, #c0625a 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.kk-godina { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.kk-cip { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px; border-radius: 999px; background: #fff; box-shadow: 0 0 0 1px var(--kk-ivica); font-size: .98rem; }
/* u jednom redu kad ima mesta */
@media (min-width: 1180px) {
  .kk-godina { flex-wrap: nowrap; gap: 6px; }
  .kk-cip { font-size: .84rem; padding: 5px 10px; gap: 6px; white-space: nowrap; }
}
.kk-cip b { font-weight: 700; }
.kk-cip i { width: 9px; height: 9px; border-radius: 50%; display: inline-block; flex: none; }

/* ---------- Faze Meseca: tamni okvir sajta (.kin) ---------- */
.kk-faze.kin { display: block; margin-top: 22px; padding: 20px 22px 14px; --kk-mesec: #fbf6e6; --kk-senka: #1b2427; }
.kk-faze .eyebrow { color: var(--mint) !important; margin: 0; }
.kk-faze .kk-rd svg circle { stroke: rgba(255, 255, 255, .35); }
.kk-faze .kk-rd__br { color: rgba(238, 243, 243, .78); }
.kk-faze .kk-rd:hover { background: rgba(255, 255, 255, .09); }
.kk-ritam__skrol { overflow-x: auto; padding: 12px 0 6px; }
.kk-ritam__niz { display: grid; gap: 2px; min-width: 930px; }
.kk-rd { display: grid; justify-items: center; gap: 4px; padding: 6px 0 4px; border-radius: 10px; background: none; border: 0; cursor: pointer; position: relative; }
.kk-rd svg { width: 26px; height: 26px; }
.kk-rd__br { font-size: .92rem; font-variant-numeric: tabular-nums; color: var(--kk-soft); }
.kk-rd.je-danas .kk-rd__br { color: #10201f; background: var(--kk-grad); border-radius: 999px; padding: 0 6px; font-weight: 700; }

/* ---------- Važni dani i Sunce ---------- */
.kk-dva { display: grid; grid-template-columns: 1.25fr 1fr; gap: 16px; margin-top: 22px; align-items: stretch; }
.kk-dva > .kk-panel:last-child { display: flex; flex-direction: column; }
.kk-dva .kk-sunce { flex: 1; align-content: center; }
.kk-sunce__luk { max-width: 420px; margin-inline: auto; width: 100%; }
.kk-panel { border-radius: var(--kk-r); background: #fff; box-shadow: 0 0 0 1px var(--kk-ivica), 0 10px 30px rgba(17, 17, 17, .06); padding: 18px 20px; min-width: 0; }
.kk-vazni { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.kk-vazni li { display: grid; grid-template-columns: 58px 1fr; gap: 10px; padding: 6px 0; font-size: 1.04rem; line-height: 1.4; border-top: 1px solid #eee; align-items: start; }
.kk-vazni li:first-child { border-top: 0; }
.kk-vazni__dat { font-family: var(--f-title); font-size: 1.4rem; line-height: 1.1; text-align: left; background: none; border: 0; padding: 0; cursor: pointer; }
.kk-vazni__dat:hover { color: var(--kk-blush); }
.kk-vazni__dat small { display: block; font-family: var(--f-body); font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; color: var(--kk-muted); }
.kk-vazni__opis b { font-weight: 700; }
.kk-vazni__opis span { display: block; color: var(--kk-soft); font-size: 1rem; font-style: italic; }
.kk-vazni__opis div + div { margin-top: 4px; }
.kk-vazni__prag { color: var(--kk-blush); }
.kk-vazni li.je-prag { background: var(--kk-grad-soft); border-radius: 12px; padding-inline: 10px; margin-inline: -10px; border-top-color: transparent; }

.kk-sunce { display: grid; gap: 14px; }
.kk-sunce__luk svg { width: 100%; height: auto; display: block; }

/* ---------- Mreža meseca ---------- */
.kk-mreza-sek.kin { display: block; margin-top: 32px; padding: 22px clamp(14px, 2.4vw, 26px) 18px; }
.kk-mreza-sek .eyebrow { color: var(--mint) !important; margin: 0 0 14px; }
.kk-mreza-sek .kk-dani-ned span { color: rgba(238, 243, 243, .6); }
.kk-psi-nap { margin-top: 14px !important; font-size: .98rem; font-style: italic; color: rgba(238, 243, 243, .75); }
.kk-psi-nap b { font-style: normal; color: #fff; }
.kk-dani-ned, .kk-mreza { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.kk-dani-ned { margin-bottom: 8px; }
/* sve kartice iste visine (kao najviša), da ostane mesta za kasnije upise: radionica, zoom… */
.kk-mreza { grid-auto-rows: minmax(250px, 1fr); }
.kk-dani-ned span { text-align: center; font-size: .84rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--kk-muted); }
.kk-prazno { display: grid; place-items: center; padding: 10px; min-width: 0; }
.kk-prazno img { width: auto; max-width: min(100%, 300px); max-height: 210px; object-fit: contain;
  filter: drop-shadow(0 0 1px rgba(255, 255, 255, .95)) drop-shadow(0 0 14px rgba(168, 230, 226, .45)); }
.kk-dan { position: relative; text-align: left; border: 0; cursor: pointer; border-radius: 14px; padding: 10px 9px 9px; min-height: 182px; min-width: 0;
  display: grid; grid-template-rows: auto auto auto 1fr auto; gap: 6px; background: #fff; box-shadow: 0 0 0 1px var(--kk-ivica);
  transition: transform .2s ease, box-shadow .2s ease; overflow: hidden; }
.kk-dan::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--ned); opacity: .85; }
.kk-dan:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px #cfcfcf, 0 10px 24px rgba(17, 17, 17, .08); }
.kk-dan.je-pocetak { background: var(--kk-grad-soft); box-shadow: 0 0 0 2px var(--kk-blush-jak); }
.kk-dan.je-pocetak::before { height: 5px; }
/* Danas: tamna kartica sa sjajem — odmah upada u oči */
.kk-dan.je-danas { color: #fff; background: radial-gradient(220px 140px at 20% 0%, rgba(168, 230, 226, .35), transparent 70%), radial-gradient(220px 160px at 100% 100%, rgba(247, 197, 192, .3), transparent 70%), #0c1416;
  box-shadow: 0 0 0 2px #a8e6e2, 0 0 0 5px rgba(168, 230, 226, .25), 0 0 34px rgba(168, 230, 226, .55); }
.kk-dan.je-danas .kk-dan__ime b { color: #fff; }
.kk-dan.je-danas .kk-dan__dno { color: rgba(238, 243, 243, .8); }
.kk-dan.je-danas .kk-dan__dno { border-top-color: rgba(255, 255, 255, .15); }
.kk-dan.je-danas .kk-dan__danas { color: #a8e6e2; }
.kk-dan.je-licni { box-shadow: 0 0 0 2px var(--kk-blush-jak); }
.kk-dan.je-danas.je-licni { box-shadow: 0 0 0 2px #a8e6e2, 0 0 0 5px rgba(232, 143, 134, .8), 0 0 34px rgba(168, 230, 226, .55); }
.kk-dan__vrh { display: flex; justify-content: space-between; align-items: flex-start; gap: 6px; }
.kk-dan__broj { font-family: var(--f-title); font-size: 1.65rem; line-height: 1; font-variant-numeric: tabular-nums; }
.kk-dan__danas { display: block; font-family: var(--f-body); font-size: .62rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--kk-mint); margin-top: 3px; }
.kk-dan__glif { display: flex; align-items: center; gap: 6px; }
.kk-dan__glif .p { width: 40px; height: 40px; border-radius: 7px; }
.kk-dan.je-gap .kk-dan__glif .p { box-shadow: 0 0 0 2px var(--kk-gap); }
.kk-dan__glif .t { width: 30px; height: auto; }
.kk .kk-dan { color: var(--kk-tekst); }
.kk .kk-dan.je-danas { color: #fff; }
.kk-dan.je-danas .kk-dan__glif .t { filter: invert(1); }
.kk-dan__ime { font-size: .9rem; line-height: 1.25; min-width: 0; }
.kk-dan__ime b { display: block; font-size: 1.02rem; letter-spacing: .04em; color: var(--kk-tekst); font-weight: 700; margin-bottom: 1px; }
.kk-dan__dno { display: flex; justify-content: space-between; gap: 4px; font-size: .86rem; color: var(--kk-muted); font-variant-numeric: tabular-nums; border-top: 1px solid #eee; padding-top: 6px; }
/* GAP dan: svetlozeleni kružić u gornjem desnom uglu */
.kk-gap { position: absolute; top: 9px; right: 9px; width: 44px; height: 44px; border-radius: 50%; display: grid; place-content: center; text-align: center;
  background: #dff3e5; color: #237a45; box-shadow: 0 0 0 1px #bfe6cb, 0 4px 12px rgba(47, 158, 90, .18);
  font-size: .62rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; line-height: 1.15; }
.kk-dan__znaci { display: grid; gap: 3px; align-content: start; }
.kk-znak { font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 1px 6px; border-radius: 999px; line-height: 1.5; white-space: nowrap; }
.kk-dan__znaci .kk-znak { width: 100%; text-align: center; font-size: .7rem; padding: 2px 4px; }
.kk-znak--zamak, .kk-znak--val, .kk-znak--luna { background: var(--kk-grad); color: #10201f; box-shadow: 0 3px 10px rgba(242, 169, 162, .35); }
.kk-znak--gap { background: #e2f4e8; color: #237a45; }
.kk-znak--nebo { background: #fcebe9; color: #a8504a; }
.kk-znak--tvoj { background: var(--kk-grad); color: #10201f; }

/* ---------- Tvoji dani ---------- */
.kk-licno { margin-top: 32px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 22px; align-items: start; }
.kk-licno__uvod { color: var(--kk-soft); }
.kk-forma { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.kk-forma label { width: 100%; font-weight: 700; font-style: italic; }
.kk-forma input { flex: 1 1 160px; min-width: 0; padding: 12px 16px; border-radius: 12px; border: 1px solid #d6d6d6; background: #fff; color: #111; font: inherit; }
.kk-forma button { border: 0; border-radius: 999px; padding: 12px 24px; background: var(--kk-grad); color: #10201f; font-weight: 700; font-style: italic; cursor: pointer; box-shadow: 0 8px 26px rgba(168, 230, 226, .35); }
.kk-forma__greska { color: var(--kk-blush); font-size: .98rem; width: 100%; }
.kk-licni-kin { display: flex; gap: 14px; align-items: center; margin-top: 18px; }
.kk-licni-kin:empty { display: none; }
.kk-licni-kin img { width: 54px; height: 54px; }
.kk-licni-kin span { color: var(--kk-soft); }
.kk-licni-spisak { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 8px; }
.kk-licni-spisak button { width: 100%; display: grid; grid-template-columns: 70px 40px 1fr; gap: 12px; align-items: center; padding: 8px 10px; border-radius: 12px; background: #f7f7f7; border: 0; text-align: left; cursor: pointer; font-size: 1.02rem; }
.kk-licni-spisak button:hover { background: var(--kk-grad-soft); }
.kk-licni-spisak img { width: 40px; height: 40px; }
.kk-d { font-family: var(--f-title); font-size: 1.1rem; }
.kk-u { display: block; font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--kk-blush); }
.kk-prazno-l { color: var(--kk-muted); font-style: italic; }

/* ---------- Detalj dana ---------- */
.kk-detalj { width: min(640px, 100% - 24px); max-height: calc(100% - 32px); border: 0; padding: 0; border-radius: 22px; background: #fff; box-shadow: 0 0 0 1px #e4e4e4, 0 30px 80px rgba(0, 0, 0, .25); color-scheme: light; }
.kk-detalj::backdrop { background: rgba(10, 15, 16, .55); backdrop-filter: blur(4px); }
.kk-det { padding: 26px 26px 22px; display: grid; gap: 18px; }
.kk-det__vrh { display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: center; }
.kk-det__glif { display: grid; justify-items: center; gap: 4px; }
.kk-det__glif .p { width: 74px; height: 74px; }
.kk-det__glif .t { width: 50px; }
.kk-det__dat { font-size: .86rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--kk-mint); }
.kk-det__ime { font-family: var(--f-title); font-weight: 400; font-size: clamp(1.35rem, 4vw, 1.75rem); margin-top: 4px !important; }
.kk-det__mesec { width: 52px; height: 52px; }
.kk-det__mesec svg { width: 100%; height: 100%; display: block; }
.kk-det__zatvori { position: absolute; right: 12px; top: 10px; border: 0; background: none; font-size: 1.6rem; line-height: 1; cursor: pointer; color: var(--kk-soft); padding: 6px 10px; }
.kk-det__mreza { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.kk-kutija { padding: 14px 16px; border-radius: 14px; background: #fafafa; box-shadow: 0 0 0 1px #eee; min-width: 0; }
.kk-kutija h3 { font-size: .8rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--kk-mint); margin-bottom: 6px !important; }
.kk-kutija p { font-size: 1.04rem; color: var(--kk-soft); }
.kk-kutija p b { color: var(--kk-tekst); }
.kk-kutija--siroka { grid-column: 1 / -1; }
.kk-orakl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 4px; }
.kk-orakl div { text-align: center; font-size: .88rem; line-height: 1.25; color: var(--kk-soft); }
.kk-orakl img { width: 40px; height: 40px; margin: 4px auto; }
.kk-orakl small { display: block; font-size: .62rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--kk-blush); }
.kk-det__nav { display: flex; justify-content: space-between; gap: 10px; }
.kk-det__nav button { border: 0; border-radius: 999px; padding: 8px 18px; background: #fff; box-shadow: 0 0 0 1px var(--kk-ivica); cursor: pointer; font-weight: 600; font-style: italic; }
.kk-det__nav button:disabled { opacity: .35; cursor: default; }
.kk-det__dog { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.kk-det__dog li { font-size: 1.04rem; color: var(--kk-soft); padding-left: 18px; position: relative; }
.kk-det__dog li::before { content: "✦"; position: absolute; left: 0; color: var(--kk-blush); font-size: .8rem; top: 2px; }
.kk-det__dog b { color: var(--kk-tekst); }

/* ---------- Tablet i telefon ---------- */
@media (max-width: 980px) {
  .kk-dva, .kk-licno { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .kk-dani-ned { display: none; }
  .kk-mreza { grid-template-columns: 1fr; grid-auto-rows: auto; }
  .kk-prazno { display: none; }
  .kk-dan { min-height: 0; grid-template-columns: 46px 74px minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; column-gap: 10px; row-gap: 2px; padding: 10px 12px; }
  .kk-dan::before { top: 0; bottom: 0; right: auto; width: 3px; height: auto; }
  .kk-dan__vrh { display: contents; }
  .kk-dan__broj { grid-column: 1; grid-row: 1 / 3; text-align: center; }
  .kk-dan__glif { grid-column: 2; grid-row: 1 / 3; }
  .kk-dan__glif .p { width: 36px; height: 36px; }
  .kk-dan__glif .t { width: 28px; }
  .kk-dan__ime { grid-column: 3; grid-row: 1; }
  .kk-dan__dno { grid-column: 3; grid-row: 2; border-top: 0; padding-top: 0; justify-content: flex-start; gap: 12px; }
  .kk-dan__znaci { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-start; margin-top: 4px; }
  .kk-dan__znaci .kk-znak { width: 110px; }
  .kk-dan__znaci:empty { display: none; }
  .kk-dan.je-gap { padding-right: 60px; }
  .kk-gap { top: 50%; transform: translateY(-50%); right: 10px; }
  .kk-dan__danas { display: none; }
  .kk-det { padding: 22px 16px 16px; }
  .kk-det__mreza { grid-template-columns: 1fr; }
  .kk-det__vrh { grid-template-columns: auto 1fr; }
  .kk-det__mesec { display: none; }
  .kk-orakl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .kk-dan { transition: none; }
}