body.elementor-page-45:not(.elementor-motion-effects-element-type-background), body.elementor-page-45 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rgm.mostarski.ba/wp-content/uploads/2026/07/radio-tast.webp");}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-db77f92 */.rgm-kontakt {
      --rgm-photo: url('https://rgm.mostarski.ba/wp-content/uploads/2026/07/radio-tast.webp');
      --rgm-surface: rgba(10, 14, 24, .55);
      --rgm-border: rgba(255, 255, 255, .12);
      --rgm-text: #f4f7fb;
      --rgm-muted: rgba(244, 247, 251, .72);
      --rgm-cyan: #4ec3e7;
      --rgm-yellow: #f2d21f;
      --rgm-green: #54b84c;
      --rgm-white: #f4f7fb;
      --rgm-blue: #6e86d8;
      position: relative;
      font-family: 'Space Grotesk', system-ui, sans-serif;
      color: var(--rgm-text);
      min-height: 100vh;
      min-height: 100svh;
      /* sadržaj kreće od vrha (isti razmak kao O nama) — naslovi se poklapaju */
      padding: clamp(24px, 4vh, 48px) clamp(20px, 4vw, 56px) clamp(40px, 6vh, 72px);
      box-sizing: border-box;
      isolation: isolate;
      overflow: hidden;
    }

    .rgm-kontakt::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -2;
      /* fixed = ista pozicija slike kao na O nama (sidreno za ekran) */
      background: var(--rgm-photo) center/cover fixed no-repeat;
    }

    .rgm-kontakt::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      background:
        radial-gradient(1100px 560px at 50% -8%, rgba(78, 195, 231, .10), transparent 60%),
        linear-gradient(180deg, rgba(5, 8, 15, .82) 0%, rgba(5, 8, 15, .68) 45%, rgba(5, 8, 15, .88) 100%);
      background-attachment: fixed;
    }

    .rgm-kontakt *,
    .rgm-kontakt *::before,
    .rgm-kontakt *::after {
      box-sizing: inherit;
      margin: 0;
      padding: 0
    }

    .rgm-wrap {
      max-width: 1160px;
      margin: 0 auto;
      width: 100%;
    }

    /* ─── Hero ──────────────────────────────────────────────────── */
    .rgm-hero {
      text-align: center;
      margin-bottom: clamp(24px, 4vh, 44px)
    }

    .rgm-title {
      font-size: clamp(30px, 4.6vw, 54px);
      font-weight: 700;
      line-height: 1.08;
      letter-spacing: -.015em;
      text-shadow: 0 4px 30px rgba(0, 0, 0, .55);
    }

    .rgm-title span {
      color: var(--rgm-cyan)
    }

    .rgm-sub {
      margin-top: 10px;
      font-size: clamp(15px, 1.7vw, 18px);
      font-weight: 400;
      color: var(--rgm-muted);
      letter-spacing: .04em;
      text-shadow: 0 2px 14px rgba(0, 0, 0, .6);
    }

    /* ─── Kontakt kartice ───────────────────────────────────────── */
    .rgm-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: clamp(14px, 2vw, 22px);
      margin-bottom: clamp(16px, 2.5vh, 26px);
    }

    .rgm-card {
      --card: var(--rgm-cyan);
      position: relative;
      display: flex;
      flex-direction: column;
      gap: 10px;
      padding: clamp(18px, 2vw, 24px);
      border-radius: 18px;
      border: 1px solid var(--rgm-border);
      background: var(--rgm-surface);
      -webkit-backdrop-filter: blur(16px);
      backdrop-filter: blur(16px);
      text-decoration: none;
      color: var(--rgm-text);
      overflow: hidden;
      text-align: center;
      transition: transform .35s cubic-bezier(.2, .7, .3, 1),
        border-color .35s ease, box-shadow .35s ease;
    }

    .rgm-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background: radial-gradient(320px 180px at 50% -20%, var(--card), transparent 70%);
      opacity: 0;
      transition: opacity .35s ease;
    }

    .rgm-card:hover,
    .rgm-card:focus-visible {
      transform: translateY(-6px);
      border-color: color-mix(in srgb, var(--card) 60%, transparent);
      box-shadow: 0 18px 44px -16px color-mix(in srgb, var(--card) 50%, transparent);
    }

    .rgm-card:hover::before,
    .rgm-card:focus-visible::before {
      opacity: .13
    }

    .rgm-card:focus-visible {
      outline: 2px solid var(--card);
      outline-offset: 3px
    }

    .rgm-card--tel {
      --card: var(--rgm-yellow)
    }

    .rgm-card--email {
      --card: var(--rgm-green)
    }

    .rgm-card--adresa {
      --card: var(--rgm-white)
    }

    .rgm-card--fm {
      --card: var(--rgm-blue)
    }

    .rgm-card h3 {
      font-size: 13px;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: var(--card);
      position: relative;
      z-index: 1;
    }

    .rgm-card p {
      font-size: clamp(15px, 1.5vw, 17px);
      font-weight: 600;
      line-height: 1.45;
      position: relative;
      z-index: 1;
    }

    .rgm-card small {
      font-size: 12.5px;
      font-weight: 400;
      color: var(--rgm-muted);
      position: relative;
      z-index: 1;
    }

    /* ─── Mapa + radno vrijeme ──────────────────────────────────── */
    .rgm-dno {
      display: grid;
      grid-template-columns: 1.6fr 1fr;
      gap: clamp(14px, 2vw, 22px);
    }

    .rgm-mapa {
      border-radius: 18px;
      border: 1px solid var(--rgm-border);
      overflow: hidden;
      min-height: 220px;
      background: var(--rgm-surface);
    }

    .rgm-mapa iframe {
      display: block;
      width: 100%;
      height: 100%;
      min-height: 220px;
      border: 0;
      /* tamna verzija mape — invert trik (Google embed nema dark temu) */
      filter: invert(92%) hue-rotate(180deg) grayscale(.25) contrast(.92) brightness(.9);
    }

    .rgm-info {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 12px;
      padding: clamp(18px, 2vw, 26px);
      border-radius: 18px;
      border: 1px solid var(--rgm-border);
      background: var(--rgm-surface);
      -webkit-backdrop-filter: blur(16px);
      backdrop-filter: blur(16px);
    }

    .rgm-info h3 {
      font-size: 13px;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: var(--rgm-cyan);
    }

    .rgm-info-red {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      font-size: 14px;
      padding: 7px 0;
      border-bottom: 1px solid rgba(255, 255, 255, .08);
    }

    .rgm-info-red:last-child {
      border-bottom: 0
    }

    .rgm-info-red span:first-child {
      color: var(--rgm-muted)
    }

    .rgm-info-red span:last-child {
      font-weight: 600
    }

    /* ─── Responsive ────────────────────────────────────────────── */
    @media(max-width:1020px) {
      .rgm-grid {
        grid-template-columns: repeat(2, 1fr)
      }

      .rgm-dno {
        grid-template-columns: 1fr
      }
    }

    @media(max-width:560px) {
      .rgm-grid {
        grid-template-columns: 1fr
      }
    }

    @media(prefers-reduced-motion:reduce) {

      .rgm-card,
      .rgm-card::before {
        transition: none
      }
    }/* End custom CSS */