/* Vlastiti header + footer (Divi CSS pokriva sadržaj stranice). */

:root{
  --dp-accent:#e09900; --dp-accent-hover:#d38200; --dp-ink:#2b2b2b;
  --dp-sand-a:#e8a33d; --dp-sand-b:#d98e2a;
  --dp-head:'McLaren','Trebuchet MS',sans-serif;
}

.dp-header{
  position:sticky; top:0; z-index:1000;
  background:rgba(255,255,255,.97);
  box-shadow:0 1px 0 rgba(0,0,0,.06);
  font-family:var(--dp-head);
}
.dp-header__in{
  max-width:1280px; margin:0 auto; padding:0 24px;
  min-height:66px;
  display:flex; align-items:center; justify-content:flex-end; gap:12px;
}
.dp-nav__list{ list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:4px; }
.dp-nav a{
  display:block; padding:.55rem .7rem;
  color:var(--dp-ink); text-decoration:none;
  font-size:16px; line-height:1.2; white-space:nowrap;
  transition:color .15s ease;
}
.dp-nav a:hover{ color:var(--dp-accent); }
.dp-nav a.is-active{ color:var(--dp-accent); }
.dp-nav__lang a{ display:flex; align-items:center; gap:.4rem; }
.dp-nav__lang img{ width:18px; height:12px; box-shadow:0 0 1px rgba(0,0,0,.4); }

.dp-toggle{ display:none; width:42px; height:42px; padding:9px; background:none; border:0; cursor:pointer; margin-left:auto; }
.dp-toggle span{ display:block; height:2px; background:var(--dp-accent); border-radius:2px; transition:transform .2s ease,opacity .2s ease; }
.dp-toggle span+span{ margin-top:6px; }
.dp-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.dp-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.dp-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }

/* Footer — pijesak + partnerski logotipi (kao original) */
.dp-footer{
  position:relative;
  background:#c9a878 url('/assets/img/footer-bg.jpg') center/cover no-repeat;
  padding:48px 24px 20px;
  text-align:center;
  color:#fff;
}
.dp-footer::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(136deg, rgba(188,122,0,.84) 2%, rgba(237,240,0,.10) 100%);
}
.dp-footer > *{ position:relative; z-index:1; }
.dp-footer__logos img{ width:min(760px,94%); height:auto; }
.dp-footer__meta{
  margin-top:16px;
  font:400 .72rem/1.5 var(--dp-head);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:8px 16px;
}
.dp-footer__meta > span{ opacity:.9; }
.dp-footer__meta a{ color:#fff; }
.dp-footer__cf{
  display:inline-flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  opacity:.82;
  transition:opacity .16s ease;
}
.dp-footer__cf:hover{ opacity:1; }
.dp-footer__cf > span{ font-size:.72rem; letter-spacing:.02em; }
.dp-footer__cf img{ height:15px; width:auto; display:block; }

/* Lightbox */
.dp-lightbox{ position:fixed; inset:0; z-index:2000; display:none; place-items:center; background:rgba(15,12,8,.94); padding:20px; }
.dp-lightbox.is-open{ display:grid; }
.dp-lightbox img{ max-width:min(1100px,94vw); max-height:88vh; width:auto; }
.dp-lightbox__x{ position:absolute; top:1rem; right:1.4rem; width:46px; height:46px; font-size:2rem; background:none; border:0; color:#fff; cursor:pointer; }

/* Divi: sakrij elemente koje ne koristimo (search, admin bar ostaci) */
#main-header, #et-secondary-nav, .et_search_form_container, #wpadminbar { display:none !important; }
/* video pozadina hero sekcije */
.et_pb_section_video_bg { overflow:hidden; }
.et_pb_section_video_bg video { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); min-width:100%; min-height:100%; width:auto; height:auto; object-fit:cover; }

/* Divi body: makni rezervirani prostor za fiksni Divi header */
#page-container{ padding-top:0 !important; }
body{ margin:0; }

/* ===== Divi bez Divi JS-a: sve module učini vidljivima (nema scroll animacija) ===== */
.et_pb_module, .et_pb_text, .et_pb_blurb, .et_pb_image, .et_pb_gallery,
.et_pb_gallery_items, .et_pb_gallery_item, .et_pb_slide, .et_pb_row, .et_pb_column,
[class*="et_pb_animation_"], .et-waypoint {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  animation: none !important;
}

/* Slike u Divi image modulima (npr. deva-logo na hero-u): postupno se "izlegu"
   iz svijetlog u normalno kad uđu u vidno polje (JS dodaje .dp-in). */
.et_pb_image.et_animated img {
  opacity: 0;
  filter: brightness(1.9) saturate(.4);
  transform: scale(.965);
  transition: opacity 1s ease, filter 1.1s ease, transform 1.1s cubic-bezier(.22,1,.36,1);
  will-change: opacity, filter, transform;
}
.et_pb_image.et_animated img.dp-in {
  opacity: 1;
  filter: none;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .et_pb_image.et_animated img { opacity: 1; filter: none; transform: none; transition: none; }
}
/* Galerije u GRID modu: Divi ih skriva (display:none) i otkriva JS-om po stranicama.
   Bez Divi JS-a — prikaži sve u gridu. */
.et_pb_gallery:not(.et_pb_slider) .et_pb_gallery_items {
  display:grid !important;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  height:auto !important;
}
.et_pb_gallery:not(.et_pb_slider) .et_pb_gallery_item {
  display:block !important;
  float:none !important;
  margin:0 !important;
  width:auto !important;
  opacity:1 !important;
  animation:none !important;
}
.et_pb_gallery_image { line-height:0; overflow:hidden; }
.et_pb_gallery_image img, .et_pb_image img { display:block; width:100%; height:auto; }
.et_pb_gallery_image a { display:block; }
.et_pb_gallery:not(.et_pb_slider) .et_pb_gallery_pagination { display:none !important; }
.dp-gallery-nav { display:flex; gap:8px; justify-content:center; margin-top:16px; flex-wrap:wrap; }
.dp-gallery-nav button {
  min-width:34px; height:34px; padding:0 8px; border:1px solid #d7d2c6; border-radius:6px;
  background:#fff; color:#2b2b2b; cursor:pointer; font:inherit;
}
.dp-gallery-nav button.is-on { background:var(--dp-accent); border-color:var(--dp-accent); color:#fff; }
@media (max-width:980px){ .et_pb_gallery:not(.et_pb_slider) .et_pb_gallery_items { grid-template-columns:repeat(3,1fr); } }
@media (max-width:600px){ .et_pb_gallery:not(.et_pb_slider) .et_pb_gallery_items { grid-template-columns:repeat(2,1fr); gap:10px; } }

/* Galerija u SLIDER modu (npr. Posjetiteljski centar) — jedan po jedan + točkice */
.et_pb_gallery.et_pb_slider .et_pb_gallery_items { position:relative; height:auto !important; overflow:hidden; }
.et_pb_gallery.et_pb_slider .et_pb_gallery_item {
  display:none !important; float:none !important; width:100% !important; margin:0 !important; opacity:1 !important;
}
.et_pb_gallery.et_pb_slider .et_pb_gallery_item.dp-slide-active { display:block !important; }
.et_pb_gallery.et_pb_slider .et_pb_gallery_image img { width:100%; aspect-ratio:16/10; object-fit:cover; }
.dp-slider-dots { display:flex; gap:8px; justify-content:center; margin-top:16px; flex-wrap:wrap; }
.dp-slider-dots button { width:10px; height:10px; padding:0; border:0; border-radius:50%; background:#d7d2c6; cursor:pointer; }
.dp-slider-dots button.is-on { background:var(--dp-accent); }
.dp-slider-arrow {
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:44px; height:44px; border:0; border-radius:50%;
  background:rgba(255,255,255,.9); color:#2b2b2b; font-size:1.5rem; cursor:pointer;
  display:grid; place-items:center; box-shadow:0 4px 14px rgba(0,0,0,.15);
}
.dp-slider-arrow.prev{ left:10px; } .dp-slider-arrow.next{ right:10px; }
@media (max-width:600px){ .dp-slider-arrow{ display:none; } }

/* Postupno učitavanje pozadinskih slika (blur-up) */
.dp-bg-fade{
  position:absolute; inset:0; z-index:0;
  background-size:cover; background-position:center; background-repeat:no-repeat;
  opacity:0; transform:scale(1.04); filter:blur(14px);
  transition:opacity .7s ease, filter .7s ease, transform .7s ease;
  pointer-events:none;
}
.dp-bg-fade.is-loaded{ opacity:1; filter:blur(0); transform:scale(1); }
.et_pb_section.et_pb_with_background > .et_pb_row,
.et_pb_section.et_pb_with_background > .et_builder_inner_content{ position:relative; z-index:1; }

/* menu: sakrij desktop nav malo kasnije da 16px stane */
@media (max-width:1100px){
  .dp-header__in{ justify-content:flex-start; }
  .dp-toggle{ display:block; }
  .dp-nav{
    position:fixed; inset:66px 0 auto 0; background:#fff;
    box-shadow:0 12px 30px rgba(0,0,0,.15);
    transform:translateY(-120%); transition:transform .28s ease;
    max-height:calc(100dvh - 66px); overflow-y:auto;
  }
  .dp-nav.is-open{ transform:translateY(0); }
  .dp-nav__list{ flex-direction:column; align-items:stretch; padding:12px; }
  .dp-nav a{ font-size:1.05rem; padding:.9rem .6rem; border-bottom:1px solid #eee; }
}

/* Video hero: ne ostavljaj Divi "preload" sivilo/spinner (JS makne klasu, ovo je fallback) */
.et_pb_section.et_pb_preload { background-color: transparent !important; }
.et_pb_section.et_pb_preload::before { content: none !important; display:none !important; }
.et_pb_preload .et_pb_section_video_bg,
.et_pb_preload > .et_pb_row { visibility: visible !important; }
.et_pb_section_video_bg { visibility: visible !important; }

/* Divi toggle (biljne vrste) — ikona + otvoreno stanje */
.et_pb_toggle_open .et_pb_toggle_content { display: block; }
.et_pb_toggle_title { cursor: pointer; }

/* Divi number counter — Divi ga drži opacity:0 do JS animacije; mi ga uvijek prikažemo */
.et_pb_number_counter { opacity: 1 !important; }
.et_pb_number_counter .percent-value { font-weight: 500; }

/* Divi fullwidth/parallax slider (npr. "Zanimljivosti" na Stari grad) */
.et_pb_slider:not(.et_pb_gallery) { position: relative; overflow: hidden; }
.et_pb_slider:not(.et_pb_gallery) .et_pb_slide.dp-slide { display: none; }
.et_pb_slider:not(.et_pb_gallery) .et_pb_slide.dp-slide.dp-slide-on { display: flex; }
.et_pb_slider:not(.et_pb_gallery) .et_pb_slide {
  position: relative;
  background-size: cover;
  background-position: center;
  min-height: 420px;
  display: flex; align-items: center;
  padding: 60px clamp(20px, 8vw, 120px);
}
.et_pb_slider:not(.et_pb_gallery) .et_pb_slide_overlay_container,
.et_pb_slider:not(.et_pb_gallery) .et_pb_slide::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: rgba(0,0,0,.45);
}
.et_pb_slider:not(.et_pb_gallery) .et_pb_container,
.et_pb_slider:not(.et_pb_gallery) .et_pb_slider_container_inner,
.et_pb_slider:not(.et_pb_gallery) .et_pb_slide_description { position: relative; z-index: 2; }
.et_pb_slider:not(.et_pb_gallery) .et_pb_slide_description { max-width: 760px; margin: 0 auto; text-align: center; color: #fff; }
.et_pb_slider:not(.et_pb_gallery) .et_pb_slide_title,
.et_pb_slider:not(.et_pb_gallery) .et_pb_slide_title a { color: #fff; font-family: var(--dp-head); font-size: clamp(1.6rem, 4vw, 2.6rem); margin-bottom: .6rem; }
.et_pb_slider:not(.et_pb_gallery) .et_pb_slide_content { color: rgba(255,255,255,.92); line-height: 1.7; }
.et_pb_slider:not(.et_pb_gallery) .et_parallax_bg_wrap { display: none; }
.et_pb_slider:not(.et_pb_gallery) .dp-slider-dots { position: absolute; left: 0; right: 0; bottom: 16px; z-index: 3; }
@media (max-width: 600px){ .et_pb_slider:not(.et_pb_gallery) .et_pb_slide { min-height: 340px; } }

/* ===================== Kontakt — redizajn ===================== */
.page-kontakt #main-content { background: #faf6ef; }

.kontakt {
  max-width: 1080px;
  margin: 0 auto;
  padding: clamp(24px, 4vw, 40px) 20px clamp(60px, 9vw, 96px);
  font-family: 'Raleway', system-ui, sans-serif;
  color: var(--dp-ink);
}

/* --- HERO: fotografija tragova u pijesku preko cijele širine (kao ostale stranice) --- */
.kontakt-hero {
  padding: clamp(30px, 4.5vw, 52px) 20px clamp(34px, 5vw, 58px);
  text-align: center;
  color: #fff;
  background-color: #7a5a2e;
  background-image:
    linear-gradient(180deg, rgba(58,38,12,.24), rgba(58,38,12,.44) 55%, rgba(66,44,16,.62)),
    url('/uploads/wp/2020/04/DSC06222.jpg');
  background-size: cover;
  background-position: center 60%;
}
.kontakt-hero__inner { max-width: 620px; margin: 0 auto; }
.kontakt-hero__badge {
  width: clamp(104px, 17vw, 138px);
  height: auto;
  margin: 0 auto 12px;
  display: block;
  filter: drop-shadow(0 6px 20px rgba(255,255,255,.3)) drop-shadow(0 3px 9px rgba(0,0,0,.35));
}
.kontakt-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 10px;
  font: 700 .82rem/1 'McLaren', 'Trebuchet MS', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #ffdca6;
}
.kontakt-hero__eyebrow svg { width: 19px; height: 19px; opacity: .9; }
.kontakt-hero__title {
  margin: 0 0 10px;
  font: 400 clamp(2.1rem, 5.5vw, 3rem)/1.08 'McLaren', 'Trebuchet MS', sans-serif;
  color: #fff;
  text-shadow: 0 2px 20px rgba(40,26,8,.35);
}
.kontakt-hero__lead {
  max-width: 520px;
  margin: 0 auto;
  font-size: 1.04rem;
  line-height: 1.7;
  color: rgba(255,255,255,.94);
  text-shadow: 0 1px 10px rgba(40,26,8,.4);
}

/* --- TIJELO: info-kartica + karta (jednake visine, poravnate) --- */
.kontakt-body {
  display: grid;
  grid-template-columns: minmax(0, 400px) 1fr;
  gap: clamp(18px, 3vw, 24px);
  align-items: stretch;
}
@media (max-width: 820px) {
  .kontakt-body { grid-template-columns: 1fr; }
}

.kontakt-card {
  background: #fff;
  border: 1px solid #efe6d5;
  border-radius: 18px;
  box-shadow: 0 24px 50px -32px rgba(120,86,20,.4);
  padding: clamp(20px, 4vw, 30px);
}
.kontakt-card__h {
  margin: 0 0 14px;
  font: 400 1.18rem/1.35 'McLaren', 'Trebuchet MS', sans-serif;
  color: var(--dp-ink);
}
.kontakt-list { list-style: none; margin: 0; padding: 0; }
.kontakt-list li + li { border-top: 1px solid #f4ecdd; }

.kontakt-li {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 13px 8px;
  border-radius: 12px;
  text-decoration: none;
  color: var(--dp-ink);
  transition: background .16s ease, transform .16s ease;
}
a.kontakt-li:hover { background: rgba(224,153,0,.09); transform: translateX(3px); }
a.kontakt-li:focus-visible { outline: 2px solid var(--dp-accent); outline-offset: 2px; }
a.kontakt-li:hover .kontakt-li__icon { background: var(--dp-accent); color: #fff; }
.kontakt-li__icon {
  flex: none;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: rgba(224,153,0,.12);
  color: var(--dp-accent-hover);
  transition: background .16s ease, color .16s ease;
}
.kontakt-li__icon svg { width: 20px; height: 20px; }
.kontakt-li__text {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.kontakt-li__label {
  font: 700 .68rem/1.2 'McLaren', 'Trebuchet MS', sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #a2937b;
}
.kontakt-li__value {
  font-size: 1rem;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.kontakt-map {
  display: flex;
  flex-direction: column;
  border: 1px solid #efe6d5;
  border-radius: 18px;
  overflow: hidden;
  background: #ece3d1;
  box-shadow: 0 24px 50px -32px rgba(120,86,20,.4);
}
.kontakt-map iframe {
  display: block;
  width: 100%;
  flex: 1 1 auto;
  min-height: clamp(300px, 42vw, 380px);
  border: 0;
}
.kontakt-map__link {
  display: block;
  text-align: center;
  padding: 12px 16px;
  font: 600 .9rem/1 'McLaren', 'Trebuchet MS', sans-serif;
  color: var(--dp-accent-hover);
  text-decoration: none;
  background: #fff;
  border-top: 1px solid #efe6d5;
}
.kontakt-map__link:hover { text-decoration: underline; }

/* --- ZAVRŠNI BLOK: društvene mreže --- */
.kontakt-tail {
  text-align: center;
  margin-top: clamp(26px, 4vw, 36px);
}
.kontakt-tail__follow {
  margin: 0 0 12px;
  font: 700 .72rem/1 'McLaren', 'Trebuchet MS', sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #a2937b;
}
.kontakt-social {
  display: flex;
  gap: 12px;
  justify-content: center;
}
.kontakt-social a {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #ece3d1;
  color: var(--dp-ink);
  transition: background .16s ease, color .16s ease, transform .16s ease, border-color .16s ease;
}
.kontakt-social a:hover {
  background: var(--dp-accent);
  border-color: var(--dp-accent);
  color: #fff;
  transform: translateY(-2px);
}
.kontakt-social a:focus-visible { outline: 2px solid var(--dp-accent); outline-offset: 2px; }
.kontakt-social svg { width: 21px; height: 21px; }

@media (prefers-reduced-motion: no-preference) {
  .kontakt-hero,
  .kontakt-body,
  .kontakt-tail { animation: kontakt-rise .7s ease-out both; }
  .kontakt-body { animation-delay: .08s; }
  .kontakt-tail { animation-delay: .14s; }
  @keyframes kontakt-rise {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: none; }
  }
}

/* Škola u prirodi — zbijeniji vertikalni ritam (manje zraka oko galerija i teksta) */
.page-skola-u-prirodi .et_pb_section { padding-top: 22px !important; padding-bottom: 22px !important; }
.page-skola-u-prirodi .et_pb_row { padding-top: 12px !important; padding-bottom: 12px !important; }
.page-skola-u-prirodi .et_pb_gallery { margin-bottom: 0 !important; }
/* umetnuta donja galerija — priljubi uz tekst iznad */
.page-skola-u-prirodi .et_pb_section_9 { padding-top: 0 !important; margin-top: -1.5em !important; }
.page-skola-u-prirodi .et_pb_section_9 .et_pb_row_9 { padding-top: 0 !important; }