/* rijec-v4.css - ucitava se POSLIJE main.css/form.css, nadjacava boje/fontove predloska Rijecinom paletom */

@font-face {
  font-family: 'Inter Tight';
  src: url('/assets/fonts/inter-tight-400-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Inter Tight';
  src: url('/assets/fonts/inter-tight-500-latin.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Instrument Serif';
  src: url('/assets/fonts/instrument-serif-400-italic-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

:root{
  --rv-tinta:#16294a;
  --rv-zlato:#b8985a;
  --rv-zlato-svijetlo:#f7f2e6;
  --rv-papir:#fbf9f5;
}

html, body { overflow-x: hidden; max-width: 100%; }

body, p, span, a, li, input, textarea, select, button, label {
  font-family: 'Inter Tight', sans-serif;
}
h1, h2, h3, h4 { font-family: 'Inter Tight', sans-serif; }

body { background: var(--rv-papir) !important; }

.rv-ser{
  font-family:'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
}

/* zamjena limeta-zelene template boje Rijecinom zlatnom/tintom */
.bg-ns-green{ background-color: var(--rv-zlato-svijetlo) !important; }
.badge-gray-light-v2, .badge-white, .badge-white-v2{
  background-color: var(--rv-zlato-svijetlo) !important;
  color: var(--rv-tinta) !important;
}
.bg-background-12{ background-color: var(--rv-papir) !important; }
.bg-background-3{ background-color: var(--rv-tinta) !important; }
h1, h2, h3, .text-secondary{ color: var(--rv-tinta) !important; }
.btn-secondary-v2, .btn-primary-v2{
  background-color: var(--rv-tinta) !important;
  color: #fff !important;
}
.btn-secondary-v2 svg, .btn-primary-v2 svg { fill: #fff; }
a, .footer-link-v2:hover, .r-link { color: var(--rv-tinta); }

/* ===================== HEADER LOGO ===================== */
.rv-logo{
  font-family:'Instrument Serif', serif;
  font-style: italic;
  font-size: 26px;
  color: var(--rv-tinta);
  text-decoration:none;
  letter-spacing: 0;
}

/* ===================== BADGE "uskoro" ===================== */
.rv-badge-uskoro{
  display:inline-flex;align-items:center;gap:8px;
  background: var(--rv-zlato-svijetlo);
  color: var(--rv-tinta);
  border:1px solid rgba(184,152,90,.35);
  border-radius:9999px;
  padding:8px 18px;
  font-size:13px;font-weight:500;letter-spacing:.02em;
}

/* ===================== HERO ===================== */
.rv-hero{
  background: linear-gradient(180deg,#1c2f52 0%, var(--rv-tinta) 55%, #101d34 100%);
  border-radius: 28px;
  color:#fff;
  padding: 64px 20px 56px;
  position:relative;
  overflow:hidden;
}
.rv-hero h1{ color:#fff !important; }
.rv-hero p.rv-hero-lede{ color: rgba(255,255,255,.72); }
.rv-hero .rv-eyebrow{ color: #e4cfa0; }

/* ===================== PHONE MOCKUP ===================== */
.rv-phonewrap{ display:flex; justify-content:center; margin-top:34px; }
.rv-phone{
  position:relative; width:280px; max-width:78vw; height:560px; max-height:64vh;
  border-radius:42px; background:#0c142a; padding:9px;
  box-shadow:0 40px 80px rgba(10,15,35,.4);
  border:1px solid rgba(184,152,90,.35);
}
.rv-phone .rv-isl{
  position:absolute; top:12px; left:50%; transform:translateX(-50%);
  width:72px; height:18px; background:#0c142a; border-radius:12px; z-index:3;
}
.rv-phone iframe{ width:100%; height:100%; border:0; border-radius:34px; background:#fff; display:block; }

/* smaller inline phone (feature rows) */
.rv-phone-sm{ width:230px; height:470px; max-height:52vh; }

/* ===================== ALTERNATING FEATURE ROW ===================== */
.rv-row{ display:flex; flex-direction:column; gap:32px; align-items:center; }
.rv-row .rv-rt{ width:100%; }
@media(min-width:1024px){
  .rv-row{ flex-direction:row; gap:56px; }
  .rv-row > *{ flex:1; }
  .rv-row.rv-rev{ flex-direction:row-reverse; }
}

/* ===================== FEATURE CARDS (4-grid) ===================== */
.rv-fcard{
  background:#fff; border-radius:22px; padding:26px;
  border:1px solid rgba(22,41,74,.08);
}
.rv-fcard .rv-ic{
  width:46px;height:46px;border-radius:13px;background:var(--rv-tinta);
  display:flex;align-items:center;justify-content:center;margin-bottom:14px;
}
.rv-fcard .rv-ic svg{ width:22px;height:22px;color:var(--rv-zlato-svijetlo); }
.rv-fcard h3{ font-size:17px; color:var(--rv-tinta); margin:0 0 6px; font-weight:500; }
.rv-fcard p{ font-size:14px; color:rgba(22,41,74,.62); margin:0; line-height:1.55; }

/* ===================== PRIGODE PILLS ===================== */
.rv-pills{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.rv-pill{
  background:#fff; border-radius:9999px; padding:11px 20px;
  font-size:14px; color: var(--rv-tinta); border:1px solid rgba(22,41,74,.08);
}

/* ===================== JEDAN RACUN ===================== */
.rv-family{
  display:flex; flex-direction:column-reverse; gap:32px; align-items:center;
}
@media(min-width:1024px){
  .rv-family{ flex-direction:row; gap:56px; align-items:center; }
  .rv-family > *{ flex:1; }
}
.rv-family img{ border-radius:22px; width:100%; height:auto; display:block; max-width:420px; margin:0 auto; }
.rv-chip-row{ display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.rv-chip{
  background: var(--rv-zlato-svijetlo); color: var(--rv-tinta);
  border-radius:9999px; padding:8px 16px; font-size:13px;
}

/* ===================== PRICING CARDS ===================== */
.rv-price-card{
  background:#fff; border-radius:22px; padding:32px 28px;
  border:1px solid rgba(22,41,74,.08);
  display:flex; flex-direction:column; justify-content:space-between; height:100%;
}
.rv-price-card h3{ font-size:19px; margin:14px 0 6px; color:var(--rv-tinta); }
.rv-price{ font-size:34px; color:var(--rv-tinta); line-height:1; margin:6px 0 10px; }
.rv-price small{ font-size:15px; color:rgba(22,41,74,.5); font-weight:400; }
.rv-price-card img{ border-radius:16px; width:100%; height:auto; aspect-ratio:1/1; object-fit:cover; }

/* ===================== OBRAZAC ===================== */
.rv-form-card{ max-width:560px; margin:0 auto; }
.rv-ok{
  background:#fff; border-radius:20px; padding:26px 28px; text-align:center;
  color: var(--rv-tinta); font-size:16px; max-width:560px; margin:0 auto;
}
.rv-err{
  background:#fdeeee; color:#8a2c2c; border-radius:12px; padding:12px 16px;
  font-size:14px; margin-bottom:14px;
}
.rv-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* footer logo */
.rv-footer-note{ color: rgba(22,41,74,.55); }

/* honeypot must not be visible/tabbable in flow */

/* glavni gumb na tamnom heroju: zlatni, da se vidi */
.rv4-zlatni.btn-secondary-v2{background:#b8985a!important;color:#16294a!important}
.rv4-zlatni.btn-secondary-v2:hover{background:#cdb583!important}

/* galerija boja narukvice */
.rv-boja-card{padding:14px 14px 18px;text-align:center}
.rv-boja-card h3{font-size:16px;margin:12px 0 0}

/* ===== HERO 25.09. vecer: tamnije nebo s kometima (po uzoru na zoora molitvenik) ===== */
.rv-hero{background:radial-gradient(120% 90% at 50% 100%,#1f2d4b 0%,#121b30 45%,#0a0f1d 100%)!important}
.rv-sky{position:absolute;inset:0;z-index:1;pointer-events:none}
.rv-sky svg{width:100%;height:100%;display:block}
.rv-qc{fill:none;stroke:rgba(228,207,160,.10);stroke-width:1.2}
.rv-qi{filter:drop-shadow(0 0 5px rgba(228,207,160,.55))}
@media (prefers-reduced-motion:reduce){.rv-qi{display:none}}
.rv4-svijetli.btn-gray-v2{background:#fff!important;color:#16294a!important}
.rv4-svijetli.btn-gray-v2:hover{background:#f7f2e6!important}
/* telefon: vlastiti zaslon "Danas" */
.rv-phone-app{height:590px;max-height:none}
.rv-app{height:100%;border-radius:34px;background:linear-gradient(180deg,#152241 0%,#0e1830 100%);color:#fff;padding:40px 22px 0;display:flex;flex-direction:column;align-items:center;text-align:center;overflow:hidden;position:relative}
.rv-app-top{display:flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:6px 14px;margin-bottom:18px}
.rv-app-logo{font-family:"Instrument Serif",serif;font-style:italic;font-size:17px;color:#fff}
.rv-app-dot{width:4px;height:4px;border-radius:50%;background:#b8985a}
.rv-app-tab{font-size:10px;letter-spacing:.18em;color:rgba(255,255,255,.6)}
.rv-app-date{font-size:10.5px;letter-spacing:.16em;color:rgba(255,255,255,.72);margin:0 0 26px}
.rv-app-eye{font-size:9.5px;letter-spacing:.2em;color:#e4cfa0;margin:0 0 12px}
.rv-app-quote{font-family:"Instrument Serif",serif;font-style:italic;font-size:25px;line-height:1.15;color:#fff;margin:0 0 10px}
.rv-app-ref{font-size:10.5px;letter-spacing:.12em;color:rgba(255,255,255,.5);margin:0 0 16px}
.rv-app-txt{font-size:13.5px;line-height:1.55;color:rgba(255,255,255,.66);margin:0 0 20px}
.rv-app-eye2{margin-bottom:6px}
.rv-app-q{font-size:14px;line-height:1.45;font-weight:500;color:#e4cfa0;margin:0 0 10px}
.rv-app-save{font-size:10.5px;color:rgba(255,255,255,.4);text-decoration:underline;margin:0}
.rv-app-bar{position:absolute;left:0;right:0;bottom:58px;height:2px;background:rgba(255,255,255,.08)}
.rv-app-bar span{display:block;height:100%;width:0;background:#b8985a;animation:rvBar 9s linear infinite}
@keyframes rvBar{from{width:0}to{width:100%}}
.rv-app-nav{position:absolute;left:0;right:0;bottom:0;height:58px;display:flex;justify-content:space-around;align-items:center;background:rgba(0,0,0,.18)}
.rv-app-nav span{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.55);background:rgba(255,255,255,.06)}
.rv-app-nav span.on{background:#b8985a;color:#16294a}
.rv-app-nav svg{width:17px;height:17px}
.rv-app>p{opacity:0;transform:translateY(6px);animation:rvIn .7s ease forwards}
.rv-app>p:nth-of-type(1){animation-delay:.6s}.rv-app>p:nth-of-type(2){animation-delay:.8s}.rv-app>p:nth-of-type(3){animation-delay:1s}.rv-app>p:nth-of-type(4){animation-delay:1.25s}.rv-app>p:nth-of-type(5){animation-delay:1.45s}.rv-app>p:nth-of-type(6){animation-delay:1.65s}.rv-app>p:nth-of-type(7){animation-delay:1.85s}.rv-app>p:nth-of-type(8){animation-delay:2s}
@keyframes rvIn{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.rv-app>p{opacity:1;transform:none;animation:none}.rv-app-bar span{animation:none;width:40%}}
@media (max-width:600px){.rv-phone-app{height:560px}.rv-app-quote{font-size:22px}}

/* kartica "Novo" - knjiga najdrazih */
.rv-fcard-novo{background:linear-gradient(180deg,#fbf6ea 0%,#f3e8cf 100%)!important;border-color:rgba(184,152,90,.45)!important}
.rv-novo{display:inline-block;background:#16294a;color:#e4cfa0;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;border-radius:999px;padding:4px 10px;margin:10px 0 2px}
