{"id":210,"date":"2026-04-27T09:14:11","date_gmt":"2026-04-27T07:14:11","guid":{"rendered":"https:\/\/opd.hr\/goldenglobe\/?page_id=210"},"modified":"2026-05-12T13:47:28","modified_gmt":"2026-05-12T11:47:28","slug":"kupa-jadran","status":"publish","type":"page","link":"https:\/\/goldenglobe.hr\/bmibramac\/kupa-jadran\/","title":{"rendered":"Kupa Jadran Crijep &#8211; BMI Bramac"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"210\" class=\"elementor elementor-210\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ade973c e-con-full e-flex e-con e-parent\" data-id=\"ade973c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-115df60 elementor-widget elementor-widget-html\" data-id=\"115df60\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* =========================================\r\n   KUPA JADRAN \u2013 PRODUCT PAGE\r\n   Elementor HTML Widget\r\n   With color selector \/ close-up image switcher\r\n========================================= *\/\r\n\r\n.kupa-page {\r\n  --bmi-blue: #009FDF;\r\n  --bmi-blue-rgb: 0, 159, 223;\r\n  --bramac-red: #d22630;\r\n  --dark: #141618;\r\n  --text: #202020;\r\n  --muted: #6b6b6b;\r\n  --line: rgba(0,0,0,0.08);\r\n  --cream: #f8f5f2;\r\n  --card: rgba(255,255,255,0.88);\r\n\r\n  color: var(--text);\r\n  font-family: inherit;\r\n  overflow: hidden;\r\n}\r\n\r\n.kupa-page * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.kupa-inner {\r\n  width: min(1240px, 100%);\r\n  margin: 0 auto;\r\n}\r\n\r\n.kupa-eyebrow {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  margin-bottom: 18px;\r\n  color: var(--bmi-blue);\r\n  font-size: 13px;\r\n  font-weight: 850;\r\n  letter-spacing: 0.12em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.kupa-eyebrow::before {\r\n  content: \"\";\r\n  width: 42px;\r\n  height: 3px;\r\n  border-radius: 999px;\r\n  background: var(--bmi-blue);\r\n}\r\n\r\n\/* =========================\r\n   1. HERO\r\n========================= *\/\r\n\r\n.kupa-hero {\r\n  position: relative;\r\n  min-height: 760px;\r\n  display: flex;\r\n  align-items: center;\r\n  padding: clamp(80px, 9vw, 140px) 20px;\r\n  background: #111;\r\n  color: #fff;\r\n  overflow: hidden;\r\n}\r\n\r\n.kupa-hero__bg {\r\n  position: absolute;\r\n  inset: 0;\r\n}\r\n\r\n.kupa-hero__bg img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  display: block;\r\n  transform: scale(1.02);\r\n}\r\n\r\n.kupa-hero__bg::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 0;\r\n  background:\r\n    linear-gradient(90deg, rgba(10,12,14,0.88) 0%, rgba(10,12,14,0.62) 42%, rgba(10,12,14,0.20) 100%),\r\n    linear-gradient(0deg, rgba(10,12,14,0.38), transparent 48%);\r\n}\r\n\r\n.kupa-hero__content {\r\n  position: relative;\r\n  z-index: 2;\r\n  max-width: 720px;\r\n}\r\n\r\n.kupa-hero__badge {\r\n  display: inline-flex;\r\n  width: fit-content;\r\n  margin-bottom: 18px;\r\n  padding: 8px 12px;\r\n  border-radius: 999px;\r\n  background: rgba(255,255,255,0.12);\r\n  border: 1px solid rgba(255,255,255,0.18);\r\n  color: rgba(255,255,255,0.84);\r\n  font-size: 12px;\r\n  font-weight: 850;\r\n  letter-spacing: 0.11em;\r\n  text-transform: uppercase;\r\n  backdrop-filter: blur(12px);\r\n}\r\n\r\n.kupa-hero__title {\r\n  margin: 0;\r\n  color: #fff;\r\n  font-size: clamp(56px, 8vw, 116px);\r\n  line-height: 0.88;\r\n  letter-spacing: -0.07em;\r\n  font-weight: 900;\r\n}\r\n\r\n.kupa-hero__lead {\r\n  margin: 26px 0 0;\r\n  max-width: 620px;\r\n  color: rgba(255,255,255,0.78);\r\n  font-size: clamp(18px, 1.6vw, 23px);\r\n  line-height: 1.65;\r\n}\r\n\r\n.kupa-hero__features {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  gap: 10px;\r\n  margin: 32px 0 0;\r\n  padding: 0;\r\n  list-style: none;\r\n}\r\n\r\n.kupa-hero__features li {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  min-height: 42px;\r\n  padding: 10px 14px;\r\n  border-radius: 999px;\r\n  background: rgba(255,255,255,0.11);\r\n  border: 1px solid rgba(255,255,255,0.14);\r\n  color: #fff;\r\n  font-size: 13px;\r\n  font-weight: 800;\r\n  backdrop-filter: blur(12px);\r\n}\r\n\r\n.kupa-hero__actions {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  gap: 12px;\r\n  margin-top: 34px;\r\n}\r\n\r\n.kupa-btn {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  min-height: 54px;\r\n  padding: 15px 24px;\r\n  border-radius: 999px;\r\n  font-size: 14px;\r\n  font-weight: 900;\r\n  text-decoration: none;\r\n  transition: 0.25s ease;\r\n}\r\n\r\n.kupa-btn--primary {\r\n  background: var(--bmi-blue);\r\n  color: #fff;\r\n  box-shadow: 0 18px 42px rgba(var(--bmi-blue-rgb),0.28);\r\n}\r\n\r\n.kupa-btn--primary:hover {\r\n  transform: translateY(-3px);\r\n  color: #fff;\r\n  box-shadow: 0 24px 54px rgba(var(--bmi-blue-rgb),0.36);\r\n}\r\n\r\n.kupa-btn--secondary {\r\n  background: rgba(255,255,255,0.12);\r\n  border: 1px solid rgba(255,255,255,0.20);\r\n  color: #fff;\r\n  backdrop-filter: blur(12px);\r\n}\r\n\r\n.kupa-btn--secondary:hover {\r\n  transform: translateY(-3px);\r\n  background: rgba(255,255,255,0.18);\r\n  color: #fff;\r\n}\r\n\r\n.kupa-hero__sample {\r\n  position: absolute;\r\n  z-index: 3;\r\n  right: clamp(20px, 6vw, 90px);\r\n  bottom: clamp(20px, 6vw, 80px);\r\n  width: min(330px, 34vw);\r\n  padding: 18px;\r\n  border-radius: 28px;\r\n  background: rgba(255,255,255,0.14);\r\n  border: 1px solid rgba(255,255,255,0.20);\r\n  backdrop-filter: blur(18px);\r\n  box-shadow: 0 30px 90px rgba(0,0,0,0.34);\r\n}\r\n\r\n.kupa-hero__sample img {\r\n  display: block;\r\n  width: 100%;\r\n  border-radius: 20px;\r\n  object-fit: cover;\r\n}\r\n\r\n.kupa-hero__sample span {\r\n  display: block;\r\n  margin-top: 12px;\r\n  color: rgba(255,255,255,0.80);\r\n  font-size: 12px;\r\n  font-weight: 850;\r\n  letter-spacing: 0.09em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n\/* =========================\r\n   2. DETAILS\r\n========================= *\/\r\n\r\n.kupa-details {\r\n  position: relative;\r\n  padding: clamp(78px, 8vw, 130px) 20px;\r\n  background:\r\n    radial-gradient(circle at 10% 12%, rgba(var(--bmi-blue-rgb),0.09), transparent 30%),\r\n    linear-gradient(135deg, #ffffff 0%, var(--cream) 100%);\r\n}\r\n\r\n.kupa-details__header {\r\n  display: grid;\r\n  grid-template-columns: minmax(0, 1fr) minmax(280px, 460px);\r\n  gap: 34px;\r\n  align-items: end;\r\n  margin-bottom: clamp(36px, 5vw, 64px);\r\n}\r\n\r\n.kupa-title {\r\n  margin: 0;\r\n  color: var(--dark);\r\n  font-size: clamp(42px, 6vw, 82px);\r\n  line-height: 0.92;\r\n  letter-spacing: -0.06em;\r\n  font-weight: 850;\r\n}\r\n\r\n.kupa-intro {\r\n  margin: 0;\r\n  color: var(--muted);\r\n  font-size: clamp(16px, 1.4vw, 19px);\r\n  line-height: 1.7;\r\n}\r\n\r\n.kupa-details__grid {\r\n  position: relative;\r\n  display: grid;\r\n  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);\r\n  gap: 28px;\r\n  align-items: start;\r\n}\r\n\r\n.kupa-color-input {\r\n  position: absolute;\r\n  opacity: 0;\r\n  pointer-events: none;\r\n}\r\n\r\n\/* Product showcase with color image switch *\/\r\n.kupa-showcase {\r\n  position: relative;\r\n  overflow: hidden;\r\n  height: clamp(430px, 48vw, 630px);\r\n  border-radius: 34px;\r\n  background:\r\n    radial-gradient(circle at 50% 42%, rgba(0,159,223,0.08), transparent 42%),\r\n    linear-gradient(135deg, #f7f4f1 0%, #ece7e1 100%);\r\n  box-shadow: 0 30px 90px rgba(24,22,21,0.14);\r\n  scroll-margin-top: 90px;\r\n}\r\n\r\n.kupa-showcase::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: auto 0 0 0;\r\n  height: 42%;\r\n  background: linear-gradient(0deg, rgb(0 0 0 \/ 18%), transparent);\r\n  pointer-events: none;\r\n  z-index: 2;\r\n}\r\n\r\n.kupa-showcase__slide {\r\n  position: absolute;\r\n  inset: 0;\r\n  opacity: 0;\r\n  transform: translateY(12px) scale(0.985);\r\n  pointer-events: none;\r\n  transition:\r\n    opacity 0.38s ease,\r\n    transform 0.38s ease;\r\n}\r\n\r\n.kupa-showcase__slide img {\r\n  width: 100%;\r\n  height: 100%;\r\n  padding: clamp(28px, 4vw, 58px);\r\n  object-fit: contain;\r\n  object-position: top;\r\n  display: block;\r\n  transition: transform 0.8s ease;\r\n}\r\n\r\n.kupa-showcase:hover .kupa-showcase__slide img {\r\n  transform: scale(1.035);\r\n}\r\n\r\n#kupa-color-magico:checked ~ .kupa-showcase .kupa-showcase__slide--magico,\r\n#kupa-color-rustik:checked ~ .kupa-showcase .kupa-showcase__slide--rustik {\r\n  opacity: 1;\r\n  transform: translateY(0) scale(1);\r\n  pointer-events: auto;\r\n}\r\n\r\n.kupa-showcase__caption {\r\n  position: absolute;\r\n  z-index: 3;\r\n  left: 24px;\r\n  right: 24px;\r\n  bottom: 24px;\r\n  padding: 20px;\r\n  border-radius: 22px;\r\n  background: rgba(20,20,20,0.56);\r\n  border: 1px solid rgba(255,255,255,0.14);\r\n  backdrop-filter: blur(14px);\r\n  color: #fff;\r\n}\r\n\r\n.kupa-showcase__caption strong {\r\n  display: block;\r\n  margin-bottom: 6px;\r\n  font-size: 22px;\r\n  line-height: 1.2;\r\n  letter-spacing: -0.03em;\r\n}\r\n\r\n.kupa-showcase__caption span {\r\n  color: rgba(255,255,255,0.72);\r\n  font-size: 14px;\r\n  line-height: 1.55;\r\n}\r\n\r\n.kupa-info-card {\r\n  padding: clamp(28px, 4vw, 46px);\r\n  border: 1px solid var(--line);\r\n  border-radius: 34px;\r\n  background: var(--card);\r\n  backdrop-filter: blur(12px);\r\n  box-shadow: 0 28px 80px rgba(24,22,21,0.10);\r\n}\r\n\r\n.kupa-info-card__label {\r\n  display: inline-flex;\r\n  width: fit-content;\r\n  margin-bottom: 16px;\r\n  padding: 8px 12px;\r\n  border-radius: 999px;\r\n  background: rgba(var(--bmi-blue-rgb),0.10);\r\n  color: var(--bmi-blue);\r\n  font-size: 11px;\r\n  font-weight: 900;\r\n  letter-spacing: 0.1em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.kupa-info-card h3 {\r\n  margin: 0 0 16px;\r\n  color: var(--dark);\r\n  font-size: clamp(30px, 3vw, 44px);\r\n  line-height: 0.98;\r\n  letter-spacing: -0.055em;\r\n  font-weight: 900;\r\n}\r\n\r\n.kupa-info-card p {\r\n  margin: 0;\r\n  color: var(--muted);\r\n  font-size: 16px;\r\n  line-height: 1.7;\r\n}\r\n\r\n.kupa-swatches {\r\n  margin-top: 28px;\r\n}\r\n\r\n.kupa-swatches__title,\r\n.kupa-specs__title {\r\n  margin: 0 0 12px;\r\n  color: #222;\r\n  font-size: 12px;\r\n  font-weight: 900;\r\n  letter-spacing: 0.09em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.kupa-swatches__list {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  gap: 10px;\r\n}\r\n\r\n.kupa-swatch {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 9px;\r\n  min-height: 42px;\r\n  padding: 8px 13px 8px 8px;\r\n  border-radius: 999px;\r\n  background: #fff;\r\n  border: 1px solid rgba(0,0,0,0.08);\r\n  color: #333;\r\n  font-size: 13px;\r\n  font-weight: 850;\r\n  cursor: pointer;\r\n  user-select: none;\r\n  transition:\r\n    transform 0.2s ease,\r\n    border-color 0.2s ease,\r\n    box-shadow 0.2s ease,\r\n    background 0.2s ease;\r\n}\r\n\r\n.kupa-swatch:hover {\r\n  transform: translateY(-2px);\r\n  border-color: rgba(var(--bmi-blue-rgb),0.35);\r\n  box-shadow: 0 10px 24px rgba(0,0,0,0.08);\r\n}\r\n\r\n.kupa-swatch::before {\r\n  content: \"\";\r\n  width: 24px;\r\n  height: 24px;\r\n  border-radius: 999px;\r\n  background: var(--swatch);\r\n  box-shadow:\r\n    inset 0 0 0 1px rgba(255,255,255,0.28),\r\n    0 5px 14px rgba(0,0,0,0.16);\r\n}\r\n\r\n#kupa-color-magico:checked ~ .kupa-info-card label[for=\"kupa-color-magico\"],\r\n#kupa-color-rustik:checked ~ .kupa-info-card label[for=\"kupa-color-rustik\"] {\r\n  border-color: rgba(var(--bmi-blue-rgb),0.55);\r\n  background: rgba(var(--bmi-blue-rgb),0.08);\r\n  box-shadow:\r\n    0 12px 28px rgba(var(--bmi-blue-rgb),0.12),\r\n    inset 0 0 0 1px rgba(var(--bmi-blue-rgb),0.08);\r\n}\r\n\r\n.kupa-color-note {\r\n  margin-top: 10px !important;\r\n  color: #777 !important;\r\n  font-size: 13px !important;\r\n  line-height: 1.5 !important;\r\n}\r\n\r\n.kupa-specs {\r\n  margin-top: 30px;\r\n}\r\n\r\n.kupa-specs__grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(2, minmax(0,1fr));\r\n  gap: 11px;\r\n}\r\n\r\n.kupa-spec {\r\n  padding: 16px;\r\n  border-radius: 18px;\r\n  background: #f5f1ed;\r\n  border: 1px solid rgba(0,0,0,0.04);\r\n}\r\n\r\n.kupa-spec span {\r\n  display: block;\r\n  margin-bottom: 6px;\r\n  color: #777;\r\n  font-size: 10px;\r\n  font-weight: 900;\r\n  letter-spacing: 0.08em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.kupa-spec strong {\r\n  color: #1b1b1b;\r\n  font-size: 15px;\r\n  line-height: 1.35;\r\n  font-weight: 900;\r\n}\r\n\r\n.kupa-benefits {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, minmax(0,1fr));\r\n  gap: 14px;\r\n  margin-top: 24px;\r\n}\r\n\r\n.kupa-benefit {\r\n  padding: 18px;\r\n  border-radius: 20px;\r\n  background: rgba(0,159,223,0.08);\r\n  border: 1px solid rgba(0,159,223,0.14);\r\n}\r\n\r\n.kupa-benefit strong {\r\n  display: block;\r\n  margin-bottom: 6px;\r\n  color: var(--dark);\r\n  font-size: 14px;\r\n  font-weight: 900;\r\n}\r\n\r\n.kupa-benefit span {\r\n  color: var(--muted);\r\n  font-size: 13px;\r\n  line-height: 1.45;\r\n}\r\n\r\n\/* =========================\r\n   3. INSPIRATION + CTA\r\n========================= *\/\r\n\r\n.kupa-cta {\r\n  position: relative;\r\n  padding: clamp(78px, 8vw, 130px) 20px;\r\n  background:\r\n    radial-gradient(circle at 12% 16%, rgba(255,255,255,0.18), transparent 28%),\r\n    linear-gradient(135deg, #0f1113 0%, #181b1f 55%, #101214 100%);\r\n  color: #fff;\r\n  overflow: hidden;\r\n}\r\n\r\n.kupa-cta::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 0;\r\n  background-image:\r\n    linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),\r\n    linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);\r\n  background-size: 54px 54px;\r\n  opacity: 0.20;\r\n  pointer-events: none;\r\n}\r\n\r\n.kupa-cta .kupa-inner {\r\n  position: relative;\r\n  z-index: 1;\r\n}\r\n\r\n.kupa-cta__header {\r\n  display: grid;\r\n  grid-template-columns: minmax(0, 1fr) minmax(280px, 460px);\r\n  gap: 34px;\r\n  align-items: end;\r\n  margin-bottom: clamp(36px, 5vw, 62px);\r\n}\r\n\r\n.kupa-cta .kupa-title {\r\n  color: #fff;\r\n}\r\n\r\n.kupa-cta .kupa-intro {\r\n  color: rgba(255,255,255,0.70);\r\n}\r\n\r\n.kupa-gallery {\r\n  display: grid;\r\n  grid-template-columns: 1.2fr 0.8fr 0.8fr;\r\n  gap: 18px;\r\n  margin-bottom: 30px;\r\n}\r\n\r\n.kupa-gallery__item {\r\n  position: relative;\r\n  min-height: 340px;\r\n  overflow: hidden;\r\n  border-radius: 28px;\r\n  background: #222;\r\n  box-shadow: 0 28px 80px rgba(0,0,0,0.28);\r\n}\r\n\r\n.kupa-gallery__item:first-child {\r\n  min-height: 460px;\r\n}\r\n\r\n.kupa-gallery__item img {\r\n  width: 100%;\r\n  height: 100%;\r\n  min-height: inherit;\r\n  object-fit: cover;\r\n  display: block;\r\n  transition: transform 1s ease;\r\n}\r\n\r\n.kupa-gallery__item:hover img {\r\n  transform: scale(1.055);\r\n}\r\n\r\n.kupa-gallery__item::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 0;\r\n  background: linear-gradient(0deg, rgb(0 0 0 \/ 18%), transparent 18);\r\n}\r\n\r\n.kupa-gallery__label {\r\n  position: absolute;\r\n  z-index: 2;\r\n  left: 18px;\r\n  right: 18px;\r\n  bottom: 18px;\r\n  color: #fff;\r\n}\r\n\r\n.kupa-gallery__label strong {\r\n  display: block;\r\n  margin-bottom: 5px;\r\n  font-size: 20px;\r\n  line-height: 1.1;\r\n  letter-spacing: -0.03em;\r\n}\r\n\r\n.kupa-gallery__label span {\r\n  display: block;\r\n  color: rgba(255,255,255,0.72);\r\n  font-size: 13px;\r\n  line-height: 1.45;\r\n}\r\n\r\n.kupa-final {\r\n  display: grid;\r\n  grid-template-columns: minmax(0, 1fr) minmax(330px, 460px);\r\n  gap: 24px;\r\n  align-items: stretch;\r\n}\r\n\r\n.kupa-final__text,\r\n.kupa-form-card {\r\n  border: 1px solid rgba(255,255,255,0.12);\r\n  border-radius: 30px;\r\n  background: rgba(255,255,255,0.07);\r\n  backdrop-filter: blur(16px);\r\n  box-shadow: 0 28px 80px rgba(0,0,0,0.25);\r\n}\r\n\r\n.kupa-final__text {\r\n  padding: clamp(28px, 4vw, 42px);\r\n}\r\n\r\n.kupa-final__text h3 {\r\n  margin: 0 0 14px;\r\n  color: #fff;\r\n  font-size: clamp(30px, 4vw, 54px);\r\n  line-height: 0.96;\r\n  letter-spacing: -0.055em;\r\n  font-weight: 900;\r\n}\r\n\r\n.kupa-final__text p {\r\n  margin: 0;\r\n  max-width: 720px;\r\n  color: rgba(255,255,255,0.72);\r\n  font-size: 16px;\r\n  line-height: 1.7;\r\n}\r\n\r\n.kupa-final__chips {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  gap: 10px;\r\n  margin-top: 26px;\r\n}\r\n\r\n.kupa-final__chips span {\r\n  display: inline-flex;\r\n  padding: 9px 12px;\r\n  border-radius: 999px;\r\n  background: rgba(0,159,223,0.14);\r\n  border: 1px solid rgba(0,159,223,0.22);\r\n  color: #fff;\r\n  font-size: 13px;\r\n  font-weight: 850;\r\n}\r\n\r\n.kupa-form-card {\r\n  padding: 26px;\r\n  background: rgba(255,255,255,0.94);\r\n  color: var(--dark);\r\n}\r\n\r\n.kupa-form-card h3 {\r\n  margin: 0 0 10px;\r\n  color: var(--dark);\r\n  font-size: 30px;\r\n  line-height: 1;\r\n  letter-spacing: -0.045em;\r\n  font-weight: 900;\r\n}\r\n\r\n.kupa-form-card p {\r\n  margin: 0 0 20px;\r\n  color: #666;\r\n  font-size: 14px;\r\n  line-height: 1.55;\r\n}\r\n\r\n.kupa-form {\r\n  display: grid;\r\n  gap: 12px;\r\n}\r\n\r\n.kupa-form input,\r\n.kupa-form textarea {\r\n  width: 100%;\r\n  min-height: 48px;\r\n  border: 1px solid rgba(0,0,0,0.10);\r\n  border-radius: 15px;\r\n  background: #fff;\r\n  padding: 13px 14px;\r\n  color: #161616;\r\n  font-family: inherit;\r\n  font-size: 14px;\r\n  outline: none;\r\n  transition: 0.2s ease;\r\n}\r\n\r\n.kupa-form textarea {\r\n  min-height: 110px;\r\n  resize: vertical;\r\n}\r\n\r\n.kupa-form input:focus,\r\n.kupa-form textarea:focus {\r\n  border-color: var(--bmi-blue);\r\n  box-shadow: 0 0 0 4px rgba(var(--bmi-blue-rgb),0.12);\r\n}\r\n\r\n.kupa-form button {\r\n  min-height: 52px;\r\n  border: 0;\r\n  border-radius: 999px;\r\n  background: var(--bramac-red);\r\n  color: #fff;\r\n  padding: 14px 20px;\r\n  font-family: inherit;\r\n  font-size: 14px;\r\n  font-weight: 950;\r\n  cursor: pointer;\r\n  transition: 0.25s ease;\r\n  box-shadow: 0 18px 42px rgba(210,38,48,0.28);\r\n}\r\n\r\n.kupa-form button:hover {\r\n  transform: translateY(-2px);\r\n  background: #ad1f27;\r\n  box-shadow: 0 24px 50px rgba(210,38,48,0.36);\r\n}\r\n\r\n.kupa-form__note {\r\n  margin: 8px 0 0 !important;\r\n  color: #777 !important;\r\n  font-size: 12px !important;\r\n  text-align: center;\r\n}\r\n\r\n\/* Responsive *\/\r\n\r\n@media (max-width: 1100px) {\r\n  .kupa-hero {\r\n    min-height: 720px;\r\n  }\r\n\r\n  .kupa-hero__sample {\r\n    display: none;\r\n  }\r\n\r\n  .kupa-details__grid,\r\n  .kupa-final {\r\n    grid-template-columns: 1fr;\r\n  }\r\n\r\n  .kupa-gallery {\r\n    grid-template-columns: 1fr 1fr;\r\n  }\r\n\r\n  .kupa-gallery__item:first-child {\r\n    grid-column: span 2;\r\n  }\r\n}\r\n\r\n@media (max-width: 780px) {\r\n  .kupa-details__header,\r\n  .kupa-cta__header {\r\n    grid-template-columns: 1fr;\r\n  }\r\n\r\n  .kupa-benefits {\r\n    grid-template-columns: 1fr;\r\n  }\r\n\r\n  .kupa-gallery {\r\n    grid-template-columns: 1fr;\r\n  }\r\n\r\n  .kupa-gallery__item:first-child {\r\n    grid-column: span 1;\r\n  }\r\n}\r\n\r\n@media (max-width: 620px) {\r\n  .kupa-hero,\r\n  .kupa-details,\r\n  .kupa-cta {\r\n    padding-left: 16px;\r\n    padding-right: 16px;\r\n  }\r\n\r\n  .kupa-hero {\r\n    min-height: 680px;\r\n  }\r\n\r\n  .kupa-hero__title {\r\n    font-size: clamp(54px, 17vw, 78px);\r\n  }\r\n\r\n  .kupa-hero__actions {\r\n    display: grid;\r\n  }\r\n\r\n  .kupa-btn {\r\n    width: 100%;\r\n  }\r\n\r\n  .kupa-specs__grid {\r\n    grid-template-columns: 1fr;\r\n  }\r\n\r\n  .kupa-showcase {\r\n    height: 550px;\r\n  }\r\n\r\n  .kupa-showcase__slide img {\r\n    min-height: 0;\r\n    padding: 28px;\r\n  }\r\n\r\n  .kupa-showcase__caption {\r\n    left: 16px;\r\n    right: 16px;\r\n    bottom: 16px;\r\n    padding: 16px;\r\n  }\r\n\r\n  .kupa-showcase__caption strong {\r\n    font-size: 19px;\r\n  }\r\n\r\n  .kupa-gallery__item,\r\n  .kupa-gallery__item:first-child {\r\n    min-height: 300px;\r\n  }\r\n\r\n  .kupa-hero__lead {\r\n    max-width: 100%;\r\n    width: 270px;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<div class=\"kupa-page\">\r\n\r\n  <!-- SECTION 1: HERO -->\r\n  <section class=\"kupa-hero\">\r\n    <div class=\"kupa-hero__bg\">\r\n      <img decoding=\"async\" src=\"https:\/\/goldenglobe.hr\/bmibramac\/wp-content\/uploads\/2026\/04\/Kupa-Jadran-Crijep.webp\" alt=\"Kupa Jadran crijep na krovu ku\u0107e\">\r\n    <\/div>\r\n\r\n    <div class=\"kupa-inner\">\r\n      <div class=\"kupa-hero__content\">\r\n        <div class=\"kupa-hero__badge\">BMI Bramac crijep<\/div>\r\n\r\n        <h1 class=\"kupa-hero__title\">Kupa Jadran<\/h1>\r\n\r\n        <p class=\"kupa-hero__lead\">\r\n          Tradicionalan mediteranski karakter s toplim, profinjenim dojmom: Za krovove koji prirodno spajaju estetiku, trajnost i autenti\u010dan izgled.\r\n        <\/p>\r\n\r\n        <ul class=\"kupa-hero__features\">\r\n          <li>Mediteranski stil<\/li>\r\n          <li>Efekt naran\u010dine kore<\/li>\r\n          <li>Za novogradnju i obnovu<\/li>\r\n        <\/ul>\r\n\r\n        <div class=\"kupa-hero__actions\">\r\n          <a class=\"kupa-btn kupa-btn--primary\" href=\"#kupa-ponuda\">Zatra\u017eite ponudu<\/a>\r\n          <a class=\"kupa-btn kupa-btn--secondary\" href=\"#kupa-detalji\">Pogledajte detalje<\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"kupa-hero__sample\">\r\n      <img decoding=\"async\" src=\"https:\/\/goldenglobe.hr\/bmibramac\/wp-content\/uploads\/2026\/04\/Kupa-Jadran-crijep-close-up-1.webp\" alt=\"Close-up Kupa Jadran crijepa\">\r\n      <span>Boja: Rustik<\/span>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- SECTION 2: DETAILS -->\r\n  <section class=\"kupa-details\" id=\"kupa-detalji\">\r\n    <div class=\"kupa-inner\">\r\n\r\n      <div class=\"kupa-details__header\">\r\n        <div>\r\n          <div class=\"kupa-eyebrow\">Dizajn i tehni\u010dki podaci<\/div>\r\n          <h2 class=\"kupa-title\">Topao izgled, pouzdana izvedba.<\/h2>\r\n        <\/div>\r\n\r\n        <p class=\"kupa-intro\">\r\n          Kupa Jadran je izbor za objekte koji tra\u017ee tradicionalan izgled krova, ali uz sigurnost suvremene proizvodnje i provjerene BMI Bramac kvalitete.\r\n        <\/p>\r\n      <\/div>\r\n\r\n      <div class=\"kupa-details__grid\">\r\n\r\n        <!-- Color radio controls -->\r\n        <input class=\"kupa-color-input\" type=\"radio\" name=\"kupa-color\" id=\"kupa-color-magico\" checked>\r\n        <input class=\"kupa-color-input\" type=\"radio\" name=\"kupa-color\" id=\"kupa-color-rustik\" >\r\n\r\n        <!-- Product image switcher -->\r\n        <div class=\"kupa-showcase\">\r\n          <div class=\"kupa-showcase__slide kupa-showcase__slide--magico\">\r\n            <img decoding=\"async\" src=\"https:\/\/goldenglobe.hr\/bmibramac\/wp-content\/uploads\/2026\/04\/Kupa-Jadran-crijep-close-up-2.webp\" alt=\"Kupa Jadran Magico\">\r\n            <div class=\"kupa-showcase__caption\">\r\n              <strong>Magico<\/strong>\r\n              <span>Topla i profinjena nijansa za prirodan mediteranski izgled krova.<\/span>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"kupa-showcase__slide kupa-showcase__slide--rustik\">\r\n            <img decoding=\"async\" src=\"https:\/\/goldenglobe.hr\/bmibramac\/wp-content\/uploads\/2026\/04\/Kupa-Jadran-crijep-close-up-1.webp\" alt=\"Kupa Jadran Rustik\">\r\n            <div class=\"kupa-showcase__caption\">\r\n              <strong>Rustik<\/strong>\r\n              <span>Izra\u017eeniji rustikalni ton za tradicionalan, topao i autenti\u010dan dojam krova.<\/span>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kupa-info-card\">\r\n          <div class=\"kupa-info-card__label\">Kupa Jadran<\/div>\r\n\r\n          <h3>Crijep za ku\u0107e koje tra\u017ee mediteransku toplinu.<\/h3>\r\n\r\n          <p>\r\n            Kupa Jadran posebno dobro pristaje ku\u0107ama s kamenom, drvom, toplim fasadama i prirodnim okru\u017eenjem. Idealan je izbor kada krov treba izgledati tradicionalno, ali uredno, kvalitetno i dugotrajno.\r\n          <\/p>\r\n\r\n          <div class=\"kupa-swatches\">\r\n            <div class=\"kupa-swatches__title\">Odaberite boju crijepa<\/div>\r\n            <div class=\"kupa-swatches__list\">\r\n              <label class=\"kupa-swatch\" for=\"kupa-color-magico\" style=\"--swatch:#b56a3f;\">Magico<\/label>\r\n              <label class=\"kupa-swatch\" for=\"kupa-color-rustik\" style=\"--swatch:#7a4632;\">Rustik<\/label>\r\n            <\/div>\r\n\r\n            <p class=\"kupa-color-note\">\r\n              Klikom na boju mijenja se close-up prikaz crijepa.\r\n            <\/p>\r\n          <\/div>\r\n\r\n          <div class=\"kupa-specs\">\r\n            <div class=\"kupa-specs__title\">Tehni\u010dki podaci<\/div>\r\n\r\n            <div class=\"kupa-specs__grid\">\r\n              <div class=\"kupa-spec\">\r\n                <span>Veli\u010dina<\/span>\r\n                <strong>330 \u00d7 420 mm<\/strong>\r\n              <\/div>\r\n\r\n              <div class=\"kupa-spec\">\r\n                <span>Te\u017eina<\/span>\r\n                <strong>4,4 kg\/kom<\/strong>\r\n              <\/div>\r\n\r\n              <div class=\"kupa-spec\">\r\n                <span>Potro\u0161nja<\/span>\r\n                <strong>cca 9,8 kom\/m\u00b2<\/strong>\r\n              <\/div>\r\n\r\n              <div class=\"kupa-spec\">\r\n                <span>Razmak letava<\/span>\r\n                <strong>31,5 \u2013 34 cm<\/strong>\r\n              <\/div>\r\n\r\n              <div class=\"kupa-spec\">\r\n                <span>Minimalni preklop<\/span>\r\n                <strong>80 mm<\/strong>\r\n              <\/div>\r\n\r\n              <div class=\"kupa-spec\">\r\n                <span>Pokrovna \u0161irina<\/span>\r\n                <strong>300 mm<\/strong>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"kupa-benefits\">\r\n            <div class=\"kupa-benefit\">\r\n              <strong>Tradicionalan dojam<\/strong>\r\n              <span>Topla estetika za ku\u0107e s karakterom.<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kupa-benefit\">\r\n              <strong>Suvremena izvedba<\/strong>\r\n              <span>Klasi\u010dan izgled uz modernu proizvodnju.<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"kupa-benefit\">\r\n              <strong>BMI sustav<\/strong>\r\n              <span>Dio cjelovitog krovnog rje\u0161enja.<\/span>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- SECTION 3: INSPIRATION + CTA -->\r\n  <section class=\"kupa-cta\" id=\"kupa-ponuda\">\r\n    <div class=\"kupa-inner\">\r\n\r\n      <div class=\"kupa-cta__header\">\r\n        <div>\r\n          <div class=\"kupa-eyebrow\">Inspiracija i ponuda<\/div>\r\n          <h2 class=\"kupa-title\">Zamislite Kupa Jadran na svom krovu.<\/h2>\r\n        <\/div>\r\n\r\n        <p class=\"kupa-intro\">\r\n          Najbolje pristaje objektima koji \u017eele toplinu, prirodan izgled i mediteranski karakter. Od obiteljskih ku\u0107a do renovacija tradicionalnih objekata.\r\n        <\/p>\r\n      <\/div>\r\n\r\n      <div class=\"kupa-gallery\">\r\n        <div class=\"kupa-gallery__item\">\r\n          <img decoding=\"async\" src=\"https:\/\/goldenglobe.hr\/bmibramac\/wp-content\/uploads\/2026\/04\/Crijep-Bramac-Kupa-Jadran-2.webp\" alt=\"Ku\u0107a s Kupa Jadran crijepom\">\r\n          <div class=\"kupa-gallery__label\">\r\n            <strong>Mediteranski karakter<\/strong>\r\n            <span>Topao krov koji se prirodno uklapa u okolinu.<\/span>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kupa-gallery__item\">\r\n          <img decoding=\"async\" src=\"https:\/\/goldenglobe.hr\/bmibramac\/wp-content\/uploads\/2026\/04\/Crijep-Bramac-Kupa-Jadran-1.webp\" alt=\"Tradicionalna ku\u0107a s Kupa Jadran krovom\">\r\n          <div class=\"kupa-gallery__label\">\r\n            <strong>Za obnovu<\/strong>\r\n            <span>Odli\u010dan izbor za renovacije i tradicionalne objekte.<\/span>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kupa-gallery__item\">\r\n          <img decoding=\"async\" src=\"https:\/\/goldenglobe.hr\/bmibramac\/wp-content\/uploads\/2026\/04\/Crijep-Bramac-Kupa-Jadran-3.webp\" alt=\"Detalj krova s Kupa Jadran crijepom\">\r\n          <div class=\"kupa-gallery__label\">\r\n            <strong>Topla estetika<\/strong>\r\n            <span>Krov koji daje ku\u0107i prirodan i doma\u0107i izgled.<\/span>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"kupa-final\">\r\n        <div class=\"kupa-final__text\">\r\n          <h3>Je li Kupa Jadran pravi izbor za va\u0161 objekt?<\/h3>\r\n          <p>\r\n            Po\u0161aljite nam osnovne informacije o krovu i pomo\u0107i \u0107emo vam odabrati odgovaraju\u0107u koli\u010dinu, dodatne krovne elemente i rje\u0161enje koje najbolje odgovara va\u0161oj ku\u0107i.\r\n          <\/p>\r\n\r\n          <div class=\"kupa-final__chips\">\r\n            <span>Mediteranske ku\u0107e<\/span>\r\n            <span>Renovacije<\/span>\r\n            <span>Topli tonovi fasade<\/span>\r\n            <span>Tradicionalna arhitektura<\/span>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"kupa-form-card\">\r\n          <h3>Zatra\u017eite ponudu<\/h3>\r\n          <p>Po\u0161aljite upit za Kupa Jadran i javit \u0107emo vam se sa savjetom ili ponudom.<\/p>\r\n\r\n          <form class=\"kupa-form\" action=\"#\" method=\"post\">\r\n            <input type=\"hidden\" name=\"proizvod\" value=\"Kupa Jadran\">\r\n\r\n            <input type=\"text\" name=\"ime_prezime\" placeholder=\"Ime i prezime *\" required>\r\n            <input type=\"tel\" name=\"telefon\" placeholder=\"Telefon *\" required>\r\n            <input type=\"email\" name=\"email\" placeholder=\"Email *\" required>\r\n            <input type=\"text\" name=\"adresa\" placeholder=\"Grad *\" required>\r\n            <textarea name=\"poruka\" placeholder=\"Napi\u0161ite povr\u0161inu krova, tip objekta ili pitanje za Kupa Jadran.\"><\/textarea>\r\n\r\n            <button type=\"submit\">Po\u0161aljite upit za Kupa Jadran<\/button>\r\n\r\n            <p class=\"kupa-form__note\">\r\n              Ili nas nazovite direktno: +385 98 210 069\r\n            <\/p>\r\n          <\/form>\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/section>\r\n\r\n<\/div>\r\n\r\n<script>\r\n(function () {\r\n  const kupaSection = document.querySelector('.kupa-page');\r\n  if (!kupaSection) return;\r\n\r\n  const colorInputs = kupaSection.querySelectorAll('input[name=\"kupa-color\"]');\r\n  const showcase = kupaSection.querySelector('.kupa-showcase');\r\n\r\n  if (!colorInputs.length || !showcase) return;\r\n\r\n  function isMobile() {\r\n    return window.matchMedia('(max-width: 780px)').matches;\r\n  }\r\n\r\n  function scrollToShowcase() {\r\n    if (!isMobile()) return;\r\n\r\n    setTimeout(function () {\r\n      const headerOffset = 90;\r\n      const showcaseTop = showcase.getBoundingClientRect().top + window.pageYOffset;\r\n      const targetPosition = showcaseTop - headerOffset;\r\n\r\n      window.scrollTo({\r\n        top: targetPosition,\r\n        behavior: 'smooth'\r\n      });\r\n    }, 120);\r\n  }\r\n\r\n  colorInputs.forEach(function (input) {\r\n    input.addEventListener('change', scrollToShowcase);\r\n  });\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-97cb7c6 elementor-hidden-desktop elementor-hidden-tablet elementor-hidden-mobile e-flex e-con-boxed e-con e-parent\" data-id=\"97cb7c6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-87d7207 bmi-elementor-hidden-form elementor-button-align-stretch elementor-widget elementor-widget-form\" data-id=\"87d7207\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;step_next_label&quot;:&quot;Next&quot;,&quot;step_previous_label&quot;:&quot;Previous&quot;,&quot;button_width&quot;:&quot;100&quot;,&quot;step_type&quot;:&quot;number_text&quot;,&quot;step_icon_shape&quot;:&quot;circle&quot;}\" data-widget_type=\"form.default\">\n\t\t\t\t\t\t\t<form class=\"elementor-form\" method=\"post\" name=\"New Form\" aria-label=\"New Form\">\n\t\t\t<input type=\"hidden\" name=\"post_id\" value=\"210\"\/>\n\t\t\t<input type=\"hidden\" name=\"form_id\" value=\"87d7207\"\/>\n\t\t\t<input type=\"hidden\" name=\"referer_title\" value=\"Kupa Jadran Crijep &#8211; BMI Bramac\" \/>\n\n\t\t\t\t\t\t\t<input type=\"hidden\" name=\"queried_id\" value=\"210\"\/>\n\t\t\t\n\t\t\t<div class=\"elementor-form-fields-wrapper elementor-labels-above\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-text elementor-field-group elementor-column elementor-field-group-name elementor-col-100 elementor-field-required\">\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"form-field-name\" class=\"elementor-field-label\">\n\t\t\t\t\t\t\t\tIme i prezime\t\t\t\t\t\t\t<\/label>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<input size=\"1\" type=\"text\" name=\"form_fields[name]\" id=\"form-field-name\" class=\"elementor-field elementor-size-sm  elementor-field-textual\" placeholder=\"Ime i prezime\" required=\"required\">\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-text elementor-field-group elementor-column elementor-field-group-field_e1cef1c elementor-col-100 elementor-field-required\">\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"form-field-field_e1cef1c\" class=\"elementor-field-label\">\n\t\t\t\t\t\t\t\tKontakt broj\t\t\t\t\t\t\t<\/label>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<input size=\"1\" type=\"text\" name=\"form_fields[field_e1cef1c]\" id=\"form-field-field_e1cef1c\" class=\"elementor-field elementor-size-sm  elementor-field-textual\" placeholder=\"Kontakt broj\" required=\"required\">\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-email elementor-field-group elementor-column elementor-field-group-email elementor-col-100 elementor-field-required\">\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"form-field-email\" class=\"elementor-field-label\">\n\t\t\t\t\t\t\t\tEmail\t\t\t\t\t\t\t<\/label>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<input size=\"1\" type=\"email\" name=\"form_fields[email]\" id=\"form-field-email\" class=\"elementor-field elementor-size-sm  elementor-field-textual\" placeholder=\"Email\" required=\"required\">\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-text elementor-field-group elementor-column elementor-field-group-field_7373df8 elementor-col-100 elementor-field-required\">\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"form-field-field_7373df8\" class=\"elementor-field-label\">\n\t\t\t\t\t\t\t\tGrad\t\t\t\t\t\t\t<\/label>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<input size=\"1\" type=\"text\" name=\"form_fields[field_7373df8]\" id=\"form-field-field_7373df8\" class=\"elementor-field elementor-size-sm  elementor-field-textual\" placeholder=\"Grad\" required=\"required\">\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-text elementor-field-group elementor-column elementor-field-group-field_82f297e elementor-col-100\">\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"form-field-field_82f297e\" class=\"elementor-field-label\">\n\t\t\t\t\t\t\t\tVrsta upita\t\t\t\t\t\t\t<\/label>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<input size=\"1\" type=\"text\" name=\"form_fields[field_82f297e]\" id=\"form-field-field_82f297e\" class=\"elementor-field elementor-size-sm  elementor-field-textual\" placeholder=\"Vrsta upita\">\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-text elementor-field-group elementor-column elementor-field-group-field_adb360b elementor-col-100\">\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"form-field-field_adb360b\" class=\"elementor-field-label\">\n\t\t\t\t\t\t\t\tPovr\u0161ina krova m2:\t\t\t\t\t\t\t<\/label>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<input size=\"1\" type=\"text\" name=\"form_fields[field_adb360b]\" id=\"form-field-field_adb360b\" class=\"elementor-field elementor-size-sm  elementor-field-textual\" placeholder=\"Povr\u0161ina krova m2:\">\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-type-textarea elementor-field-group elementor-column elementor-field-group-message elementor-col-100\">\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"form-field-message\" class=\"elementor-field-label\">\n\t\t\t\t\t\t\t\tPoruka\t\t\t\t\t\t\t<\/label>\n\t\t\t\t\t\t<textarea class=\"elementor-field-textual elementor-field  elementor-size-sm\" name=\"form_fields[message]\" id=\"form-field-message\" rows=\"4\" placeholder=\"Poruka\"><\/textarea>\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"elementor-field-group elementor-column elementor-field-type-submit elementor-col-100 e-form__buttons\">\n\t\t\t\t\t<button class=\"elementor-button elementor-size-sm\" type=\"submit\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Send<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/button>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/form>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-86291eb elementor-widget elementor-widget-html\" data-id=\"86291eb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n  \/* Skriva Elementor formu, ali je ostavlja aktivnom za slanje *\/\r\n  .bmi-elementor-hidden-form,\r\n  form[name=\"New Form\"] {\r\n    position: absolute !important;\r\n    left: -99999px !important;\r\n    top: auto !important;\r\n    width: 1px !important;\r\n    height: 1px !important;\r\n    overflow: hidden !important;\r\n    opacity: 0 !important;\r\n    pointer-events: none !important;\r\n  }\r\n\r\n  .kupa-form__response {\r\n    margin-top: 14px;\r\n    font-size: 14px;\r\n    line-height: 1.5;\r\n    font-weight: 500;\r\n  }\r\n\r\n  .kupa-form__response.is-success {\r\n    color: #157347;\r\n  }\r\n\r\n  .kupa-form__response.is-error {\r\n    color: #b42318;\r\n  }\r\n\r\n  .kupa-form__response.is-loading {\r\n    color: #555;\r\n  }\r\n\r\n  .kupa-form button[type=\"submit\"].is-loading {\r\n    opacity: 0.7;\r\n    cursor: wait;\r\n    pointer-events: none;\r\n  }\r\n<\/style>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function () {\r\n  \/\/ 1. Prona\u0111i novu custom formu\r\n  const customForm = document.querySelector('form.kupa-form');\r\n\r\n  \/\/ 2. Prona\u0111i Elementor formu\r\n  const elementorForm =\r\n    document.querySelector('.bmi-elementor-hidden-form form.elementor-form') ||\r\n    document.querySelector('form.elementor-form[name=\"New Form\"]') ||\r\n    document.querySelector('form.elementor-form');\r\n\r\n  if (!customForm) {\r\n    console.warn('HTML kupa-forma nije prona\u0111ena.');\r\n    return;\r\n  }\r\n\r\n  if (!elementorForm) {\r\n    console.warn('Elementor forma nije prona\u0111ena.');\r\n    return;\r\n  }\r\n\r\n  const customSubmit = customForm.querySelector('button[type=\"submit\"]');\r\n\r\n  \/\/ Kreiraj prostor za poruke ako ne postoji\r\n  let responseBox = customForm.querySelector('.kupa-form__response');\r\n\r\n  if (!responseBox) {\r\n    responseBox = document.createElement('p');\r\n    responseBox.className = 'kupa-form__response';\r\n    responseBox.setAttribute('aria-live', 'polite');\r\n\r\n    if (customSubmit) {\r\n      customSubmit.insertAdjacentElement('afterend', responseBox);\r\n    } else {\r\n      customForm.appendChild(responseBox);\r\n    }\r\n  }\r\n\r\n  elementorForm.setAttribute('aria-hidden', 'true');\r\n\r\n  elementorForm.querySelectorAll('input, textarea, select, button').forEach(function (field) {\r\n    field.setAttribute('tabindex', '-1');\r\n  });\r\n\r\n  \/\/ Funkcija za preuzimanje vrijednosti iz HTML forme\r\n  function getCustomValue(selector) {\r\n    const field = customForm.querySelector(selector);\r\n    return field ? field.value.trim() : '';\r\n  }\r\n\r\n  \/\/ Funkcija za upisivanje vrijednosti u Elementor formu\r\n  function setElementorValue(selector, value) {\r\n    const field = elementorForm.querySelector(selector);\r\n\r\n    if (!field) {\r\n      console.warn('Elementor polje nije prona\u0111eno:', selector);\r\n      return;\r\n    }\r\n\r\n    field.value = value;\r\n    field.dispatchEvent(new Event('input', { bubbles: true }));\r\n    field.dispatchEvent(new Event('change', { bubbles: true }));\r\n  }\r\n\r\n  function showMessage(message, type) {\r\n    responseBox.textContent = message;\r\n    responseBox.className = 'kupa-form__response'; \/\/ reset klasa\r\n\r\n    if (type) {\r\n      responseBox.classList.add('is-' + type);\r\n    }\r\n  }\r\n\r\n  function lockSubmit() {\r\n    if (!customSubmit) return;\r\n    customSubmit.disabled = true;\r\n    customSubmit.classList.add('is-loading');\r\n  }\r\n\r\n  function unlockSubmit() {\r\n    if (!customSubmit) return;\r\n    customSubmit.disabled = false;\r\n    customSubmit.classList.remove('is-loading');\r\n  }\r\n\r\n  \/\/ Akcija pri slanju (Submit)\r\n  customForm.addEventListener('submit', function (event) {\r\n    event.preventDefault();\r\n\r\n    if (!customForm.checkValidity()) {\r\n      customForm.reportValidity();\r\n      return;\r\n    }\r\n\r\n    \/\/ Povla\u010denje podataka iz Kupa Jadran HTML forme\r\n    const imePrezime = getCustomValue('input[name=\"ime_prezime\"]');\r\n    const telefon    = getCustomValue('input[name=\"telefon\"]');\r\n    const email      = getCustomValue('input[name=\"email\"]');\r\n    const adresa     = getCustomValue('input[name=\"adresa\"]');\r\n    const proizvod   = getCustomValue('input[name=\"proizvod\"]'); \/\/ Hidden field\r\n    const poruka     = getCustomValue('textarea[name=\"poruka\"]');\r\n\r\n    \/\/ Upisivanje u Elementor formu prema ID-evima koje si dao\r\n    setElementorValue('#form-field-name', imePrezime);\r\n    setElementorValue('#form-field-field_e1cef1c', telefon);\r\n    setElementorValue('#form-field-email', email);\r\n    setElementorValue('#form-field-field_7373df8', adresa); \/\/ Adresa ide u polje Grad\r\n    setElementorValue('#form-field-field_82f297e', proizvod); \/\/ Skriveni naziv proizvoda ide u Vrstu upita\r\n    setElementorValue('#form-field-field_adb360b', ''); \/\/ Prazno jer korisnik to pi\u0161e u polje \"poruka\"\r\n    setElementorValue('#form-field-message', poruka);\r\n\r\n    showMessage('\u0160aljemo va\u0161 upit...', 'loading');\r\n    lockSubmit();\r\n\r\n    const elementorSubmit = elementorForm.querySelector('button[type=\"submit\"]');\r\n\r\n    if (!elementorSubmit) {\r\n      showMessage('Gre\u0161ka: Elementor submit gumb nije prona\u0111en.', 'error');\r\n      unlockSubmit();\r\n      return;\r\n    }\r\n\r\n    elementorSubmit.click();\r\n  });\r\n\r\n  \/\/ Pra\u0107enje odgovora Elementor forme (Mutation Observer za Ajax response)\r\n  const observer = new MutationObserver(function () {\r\n    const successMessage = elementorForm.querySelector('.elementor-message-success');\r\n    const errorMessage =\r\n      elementorForm.querySelector('.elementor-message-danger') ||\r\n      elementorForm.querySelector('.elementor-error');\r\n\r\n    if (successMessage) {\r\n      showMessage('Hvala! Va\u0161 upit je uspje\u0161no poslan. Javit \u0107emo vam se uskoro.', 'success');\r\n      customForm.reset();\r\n      unlockSubmit();\r\n    }\r\n\r\n    if (errorMessage) {\r\n      showMessage(\r\n        errorMessage.textContent.trim() || 'Do\u0161lo je do gre\u0161ke prilikom slanja. Molimo poku\u0161ajte ponovno.',\r\n        'error'\r\n      );\r\n      unlockSubmit();\r\n    }\r\n  });\r\n\r\n  observer.observe(elementorForm, {\r\n    childList: true,\r\n    subtree: true\r\n  });\r\n\r\n  \/\/ Fallback pra\u0107enje pomo\u0107u jQuery doga\u0111aja iz Elementora\r\n  if (window.jQuery) {\r\n    jQuery(document).on('submit_success', function (event) {\r\n      const submittedForm = event.target;\r\n\r\n      if (submittedForm === elementorForm || elementorForm.contains(submittedForm)) {\r\n        showMessage('Hvala! Va\u0161 upit je uspje\u0161no poslan. Javit \u0107emo vam se uskoro.', 'success');\r\n        customForm.reset();\r\n        unlockSubmit();\r\n      }\r\n    });\r\n\r\n    jQuery(document).on('submit_error', function (event) {\r\n      const submittedForm = event.target;\r\n\r\n      if (submittedForm === elementorForm || elementorForm.contains(submittedForm)) {\r\n        showMessage('Do\u0161lo je do gre\u0161ke prilikom slanja. Molimo poku\u0161ajte ponovno.', 'error');\r\n        unlockSubmit();\r\n      }\r\n    });\r\n  }\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>BMI Bramac crijep Kupa Jadran Tradicionalan mediteranski karakter s toplim, profinjenim dojmom: Za krovove koji prirodno spajaju estetiku, trajnost i autenti\u010dan izgled. Mediteranski stil Efekt naran\u010dine kore Za novogradnju i obnovu Zatra\u017eite ponudu Pogledajte detalje Boja: Rustik Dizajn i tehni\u010dki podaci Topao izgled, pouzdana izvedba. Kupa Jadran je izbor za objekte koji tra\u017ee tradicionalan izgled [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-210","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/goldenglobe.hr\/bmibramac\/wp-json\/wp\/v2\/pages\/210","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/goldenglobe.hr\/bmibramac\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/goldenglobe.hr\/bmibramac\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/goldenglobe.hr\/bmibramac\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/goldenglobe.hr\/bmibramac\/wp-json\/wp\/v2\/comments?post=210"}],"version-history":[{"count":58,"href":"https:\/\/goldenglobe.hr\/bmibramac\/wp-json\/wp\/v2\/pages\/210\/revisions"}],"predecessor-version":[{"id":649,"href":"https:\/\/goldenglobe.hr\/bmibramac\/wp-json\/wp\/v2\/pages\/210\/revisions\/649"}],"wp:attachment":[{"href":"https:\/\/goldenglobe.hr\/bmibramac\/wp-json\/wp\/v2\/media?parent=210"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}