/* =====================================================================
 * GimnConnect na sajtu — telefon, dugmad za preuzimanje, strana /aplikacija
 * (Igor 2026-10-03). Učitava se sa ?v= (Cloudflare keš).
 * ===================================================================== */

/* ── Znak aplikacije ─────────────────────────────────────────────── */
.gc-znak { display:inline-flex; color:#e1b863; }
.gc-znak svg { width:100%; height:100%; display:block; }

/* ── Telefon ──────────────────────────────────────────────────────── */
.gc-phone {
  /* svijetla tema — iste vrijednosti kao kompas/assets/kompas.css :root */
  --gc-bg:#f7f7f3; --gc-card:#ffffff; --gc-card2:#f4f3ee; --gc-line:#edece4;
  --gc-ink:#0f172a; --gc-ink2:#334155; --gc-mut:#64748b; --gc-gold:#b8892f; --gc-gold-d:#d4a547;
  --gc-red:#dc2626; --gc-blue:#2563eb; --gc-green:#1e9e5a;
  position:relative; width:300px; height:612px; flex:none;
  font-family:'Inter', system-ui, sans-serif; text-align:left;
}
.gc-glow {
  position:absolute; inset:8% -18% 4%; border-radius:50%; z-index:0; pointer-events:none;
  background:radial-gradient(closest-side, rgba(212,165,71,.42), rgba(37,99,235,.18) 55%, transparent 75%);
  filter:blur(18px); animation:gcGlow 7s ease-in-out infinite;
}
@keyframes gcGlow { 0%,100% { transform:scale(1); opacity:.85; } 50% { transform:scale(1.07); opacity:1; } }
.gc-phone-frame {
  position:relative; z-index:1; width:100%; height:100%; border-radius:48px; padding:11px;
  background:linear-gradient(145deg, #2b3954, #0d1528 40%, #1d2a44);
  box-shadow:0 0 0 1.5px rgba(255,255,255,.14) inset, 0 40px 80px -28px rgba(2,8,23,.85), 0 18px 40px -20px rgba(2,8,23,.7);
  animation:gcLebdi 6s ease-in-out infinite;
}
@keyframes gcLebdi { 0%,100% { transform:translateY(0) rotate(-1.2deg); } 50% { transform:translateY(-12px) rotate(.4deg); } }
.gc-island { position:absolute; top:20px; left:50%; transform:translateX(-50%); width:92px; height:26px; border-radius:20px; background:#02060f; z-index:6; }
.gc-screen {
  position:relative; width:100%; height:100%; border-radius:38px; overflow:hidden;
  background:radial-gradient(120% 55% at 50% 0%, #fdf6e6 0%, var(--gc-bg) 62%); color:var(--gc-ink);
}
.gc-status { position:relative; z-index:5; display:flex; justify-content:space-between; align-items:center; padding:14px 26px 0 30px; font:700 12px/1 'Plus Jakarta Sans', sans-serif; }
.gc-st-r { display:flex; align-items:flex-end; gap:2px; }
.gc-st-r i { width:3px; border-radius:1px; background:var(--gc-ink); }
.gc-st-r i:nth-child(1) { height:5px; } .gc-st-r i:nth-child(2) { height:7px; } .gc-st-r i:nth-child(3) { height:9px; }
.gc-st-r em { margin-left:5px; width:20px; height:10px; border-radius:3px; border:1.5px solid var(--gc-ink); position:relative; }
.gc-st-r em::after { content:''; position:absolute; inset:1.5px 5px 1.5px 1.5px; border-radius:1px; background:var(--gc-ink); }

/* ekrani */
.gc-ekrani { position:absolute; inset:46px 0 70px; }
.gc-ek {
  position:absolute; inset:0; padding:12px 18px 0; opacity:0; transform:translateX(26px) scale(.98);
  transition:opacity .55s cubic-bezier(.16,1,.3,1), transform .65s cubic-bezier(.16,1,.3,1); pointer-events:none;
}
.gc-ek.is-on { opacity:1; transform:none; }
.gc-ek.je-van { opacity:0; transform:translateX(-26px) scale(.98); }
.gc-hi small { display:block; font:600 9.5px/1.3 'Inter',sans-serif; color:var(--gc-mut); text-transform:uppercase; letter-spacing:.05em; }
.gc-hi h4 { margin:3px 0 12px; font:800 19px/1.2 'Plus Jakarta Sans',sans-serif; letter-spacing:-.03em; color:var(--gc-ink); }
.gc-hi h4 em { font-family:'Fraunces',Georgia,serif; font-style:italic; font-weight:500; color:var(--gc-gold); }

/* Početna */
.gc-sada { display:flex; align-items:center; gap:12px; padding:13px; border-radius:18px; color:#fff;
  background:linear-gradient(135deg, #1b3561, #0b1f3b); border:1px solid rgba(225,184,99,.35);
  box-shadow:0 14px 26px -16px rgba(212,165,71,.55); }
.gc-ring { position:relative; width:52px; height:52px; flex:none; }
.gc-ring svg { width:100%; height:100%; transform:rotate(-90deg); }
.gc-ring circle { fill:none; stroke-width:4; }
.gc-ring .bg { stroke:rgba(255,255,255,.1); }
.gc-ring .fg { stroke:#e1b863; stroke-linecap:round; stroke-dasharray:119.4; stroke-dashoffset:42; }
.gc-ek.is-on .gc-ring .fg { animation:gcRing 3.6s ease-out both; }
@keyframes gcRing { from { stroke-dashoffset:119.4; } to { stroke-dashoffset:42; } }
.gc-ring span { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1; }
.gc-ring b { font:800 15px 'Plus Jakarta Sans',sans-serif; }
.gc-ring small { font-size:7.5px; color:rgba(255,255,255,.6); margin-top:1px; }
.gc-sada-t { display:flex; flex-direction:column; min-width:0; }
.gc-sada-t small { display:flex; align-items:center; gap:5px; font:800 8.5px 'Plus Jakarta Sans',sans-serif; letter-spacing:.1em; color:#e1b863; }
.gc-sada-t small i { width:6px; height:6px; border-radius:50%; background:#e1b863; animation:gcPuls 1.6s ease-out infinite; }
@keyframes gcPuls { 0% { box-shadow:0 0 0 0 rgba(225,184,99,.7); } 100% { box-shadow:0 0 0 7px rgba(225,184,99,0); } }
.gc-sada-t b { font:800 17px/1.2 'Plus Jakarta Sans',sans-serif; margin-top:2px; }
.gc-sada-t span { font-size:10px; color:rgba(255,255,255,.65); margin-top:2px; }
.gc-next { display:flex; align-items:center; gap:7px; margin-top:8px; padding:8px 11px; border-radius:12px; background:var(--gc-card); border:1px solid var(--gc-line); font-size:10px; color:var(--gc-mut); }
.gc-next svg, .gc-ob-ic svg, .gc-dir svg, .gc-tab svg, .gc-chip-ic svg { fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.gc-next svg { width:13px; height:13px; color:var(--gc-gold); }
.gc-next b { color:var(--gc-ink); }
.gc-lbl { margin:14px 0 7px; font:800 11px 'Plus Jakarta Sans',sans-serif; color:var(--gc-ink); }
.gc-red { display:flex; align-items:center; gap:10px; padding:9px 11px; margin-bottom:6px; border-radius:12px; background:var(--gc-card); border:1px solid var(--gc-line); box-shadow:0 4px 10px -8px rgba(15,23,42,.25);
  opacity:0; transform:translateY(8px); }
.gc-ek.is-on .gc-red { animation:gcUp .5s cubic-bezier(.16,1,.3,1) forwards; }
.gc-ek.is-on .gc-red:nth-of-type(2) { animation-delay:.15s; } .gc-ek.is-on .gc-red:nth-of-type(3) { animation-delay:.25s; } .gc-ek.is-on .gc-red:nth-of-type(4) { animation-delay:.35s; }
@keyframes gcUp { to { opacity:1; transform:none; } }
.gc-red span { width:22px; height:22px; border-radius:7px; display:grid; place-items:center; background:var(--gc-card2); font:800 10px 'Plus Jakarta Sans',sans-serif; color:var(--gc-mut); }
.gc-red b { flex:1; font:700 11.5px 'Plus Jakarta Sans',sans-serif; }
.gc-red i { font-style:normal; font-size:10px; color:var(--gc-mut); }

/* Obavještenja */
.gc-ob { padding:12px; margin-bottom:9px; border-radius:16px; background:var(--gc-card); border:1px solid var(--gc-line); }
.gc-ob.je-hitno { border-color:rgba(37,99,235,.35); box-shadow:0 12px 24px -16px rgba(37,99,235,.55); }
.gc-ob-g { display:flex; align-items:center; gap:9px; }
.gc-ob-g b { font:800 12px/1.3 'Plus Jakarta Sans',sans-serif; }
.gc-ob-ic { width:28px; height:28px; flex:none; border-radius:9px; display:grid; place-items:center; background:rgba(37,99,235,.1); color:var(--gc-blue); }
.gc-ob-ic.ze { background:rgba(30,158,90,.12); color:var(--gc-green); }
.gc-ob-ic svg { width:15px; height:15px; }
.gc-hitno { display:inline-block; margin:8px 0 0 37px; padding:2px 7px; border-radius:6px; background:rgba(220,38,38,.1); color:var(--gc-red); font:800 8.5px 'Plus Jakarta Sans',sans-serif; letter-spacing:.06em; }
.gc-ob-od { display:flex; align-items:center; gap:5px; margin:7px 0 0 37px; font-size:10px; font-weight:700; color:var(--gc-ink2); }
.gc-ob-od em { font-style:normal; font-size:8.5px; font-weight:700; padding:1px 6px; border-radius:99px; background:var(--gc-card2); color:var(--gc-mut); }
.gc-dir { width:15px; height:15px; border-radius:5px; display:grid; place-items:center; background:rgba(225,184,99,.16); color:var(--gc-gold); }
.gc-dir svg { width:10px; height:10px; }
.gc-ob p { margin:8px 0 0 37px; font-size:10px; line-height:1.45; color:var(--gc-mut); }

/* Kalendar */
.gc-kal { display:grid; grid-template-columns:repeat(7,1fr); gap:3px; padding:10px; border-radius:16px; background:var(--gc-card); border:1px solid var(--gc-line); text-align:center; }
.gc-kal b { font:700 8px 'Inter',sans-serif; color:var(--gc-mut); padding-bottom:3px; }
.gc-kal span { position:relative; height:24px; display:grid; place-items:center; border-radius:8px; font:700 10px 'Plus Jakarta Sans',sans-serif; color:var(--gc-ink2); }
.gc-kal span.danas { box-shadow:0 0 0 1.5px var(--gc-gold-d) inset; color:var(--gc-gold); }
.gc-kal span.izab { background:#0b1f3b; color:#fff; }
.gc-kal span i { position:absolute; bottom:2px; width:4px; height:4px; border-radius:50%; }
.gc-kal i.cr { background:#dc2626; } .gc-kal i.pl { background:var(--gc-blue); } .gc-kal i.zl { background:var(--gc-gold); }
.gc-kal span.izab i { background:#e1b863; }
.gc-ev { position:relative; display:flex; flex-direction:column; gap:2px; margin-top:8px; padding:10px 12px 10px 15px; border-radius:13px; background:var(--gc-card); border:1px solid var(--gc-line); overflow:hidden; }
.gc-ev::before { content:''; position:absolute; left:0; top:0; bottom:0; width:3px; }
.gc-ev.cr::before { background:#dc2626; } .gc-ev.pl::before { background:var(--gc-blue); }
.gc-ev b { font:800 11.5px 'Plus Jakarta Sans',sans-serif; } .gc-ev span { font-size:9.5px; color:var(--gc-mut); }
.gc-ev em { position:absolute; right:10px; top:10px; font-style:normal; font:800 8px 'Plus Jakarta Sans',sans-serif; padding:2px 6px; border-radius:6px; }
.gc-ev.cr em { background:rgba(220,38,38,.1); color:#dc2626; } .gc-ev.pl em { background:rgba(37,99,235,.1); color:var(--gc-blue); }

/* Ocjene */
.gc-usp { display:flex; align-items:center; justify-content:space-between; padding:14px; border-radius:16px; color:#fff; background:linear-gradient(135deg,#1b3561,#0b1f3b); margin-bottom:10px; box-shadow:0 12px 22px -16px rgba(11,31,59,.7); }
.gc-usp b { display:block; font:800 17px 'Plus Jakarta Sans',sans-serif; color:#47cf8c; }
.gc-usp small { font-size:8.5px; color:rgba(255,255,255,.6); }
.gc-usp span { font:800 24px 'Plus Jakarta Sans',sans-serif; padding:6px 10px; border-radius:12px; background:rgba(255,255,255,.1); color:#e1b863; }
.gc-pr { display:grid; grid-template-columns:1fr 70px 24px; align-items:center; gap:9px; padding:8px 10px; margin-bottom:6px; border-radius:11px; background:var(--gc-card); border:1px solid var(--gc-line); }
.gc-pr b { font:700 11px 'Plus Jakarta Sans',sans-serif; }
.gc-pr i { height:5px; border-radius:9px; background:var(--gc-card2); overflow:hidden; }
.gc-pr i em { display:block; height:100%; width:0; border-radius:9px; background:linear-gradient(90deg,var(--gc-gold-d),#e1b863); }
.gc-ek.is-on .gc-pr i em { animation:gcBar 1.2s cubic-bezier(.16,1,.3,1) .2s forwards; }
@keyframes gcBar { to { width:var(--w); } }
.gc-pr span { width:24px; height:24px; border-radius:7px; display:grid; place-items:center; font:800 12px 'Plus Jakarta Sans',sans-serif; }
.gc-pr .o5 { background:rgba(30,158,90,.12); color:var(--gc-green); } .gc-pr .o4 { background:rgba(37,99,235,.1); color:var(--gc-blue); }

/* Notifikacija koja padne */
.gc-push {
  position:absolute; z-index:7; left:10px; right:10px; top:10px; display:flex; gap:10px; align-items:center;
  padding:10px 12px; border-radius:20px; background:rgba(255,255,255,.95); backdrop-filter:blur(14px);
  border:1px solid rgba(15,23,42,.08); box-shadow:0 18px 30px -14px rgba(15,23,42,.45);
  transform:translateY(-130%); opacity:0;
}
.gc-push.pada { animation:gcPush 3.4s cubic-bezier(.16,1,.3,1) forwards; }
@keyframes gcPush { 0% { transform:translateY(-130%); opacity:0; } 12% { transform:translateY(0); opacity:1; } 78% { transform:translateY(0); opacity:1; } 100% { transform:translateY(-130%); opacity:0; } }
.gc-push-ic { width:32px; height:32px; flex:none; border-radius:9px; display:grid; place-items:center; background:linear-gradient(145deg,#132a52,#06142e); }
.gc-push div { display:flex; flex-direction:column; min-width:0; line-height:1.25; }
.gc-push small { font-size:8.5px; color:var(--gc-mut); }
.gc-push b { font:800 10.5px 'Plus Jakarta Sans',sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gc-push i { font-style:normal; font-size:9px; color:var(--gc-ink2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Tab traka */
.gc-tab { position:absolute; z-index:5; left:12px; right:12px; bottom:12px; height:50px; display:flex; justify-content:space-around; align-items:center;
  border-radius:24px; background:rgba(255,255,255,.96); border:1px solid var(--gc-line); box-shadow:0 10px 24px -14px rgba(15,23,42,.35); }
.gc-tab i { width:38px; height:34px; display:grid; place-items:center; border-radius:14px; color:var(--gc-mut); transition:background .35s, color .35s; }
.gc-tab i.on { background:#0b1f3b; color:#e1b863; }
.gc-tab svg { width:18px; height:18px; }

/* Plutajući čipovi oko telefona */
.gc-chip { position:absolute; z-index:3; display:flex; align-items:center; gap:9px; padding:9px 13px 9px 9px; border-radius:16px;
  background:rgba(255,255,255,.96); color:#0f172a; box-shadow:0 18px 34px -16px rgba(2,8,23,.55); white-space:nowrap; }
.gc-chip span:last-child { display:flex; flex-direction:column; line-height:1.2; }
.gc-chip b { font:800 12px 'Plus Jakarta Sans',sans-serif; } .gc-chip small { font-size:10px; color:#64748b; }
.gc-chip-ic { width:30px; height:30px; border-radius:10px; display:grid; place-items:center; }
.gc-chip-ic svg { width:16px; height:16px; }
.gc-chip-ic.go { background:#fdf3dc; color:#b8892f; } .gc-chip-ic.ze { background:#dcfce7; color:#16a34a; } .gc-chip-ic.pl { background:#dbeafe; color:#2563eb; }
.gc-chip.c1 { top:13%; left:-150px; animation:gcCip 5.5s ease-in-out infinite; }
.gc-chip.c2 { top:46%; right:-120px; animation:gcCip 6.5s ease-in-out .8s infinite; }
.gc-chip.c3 { bottom:14%; left:-130px; animation:gcCip 6s ease-in-out 1.6s infinite; }
@keyframes gcCip { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-10px); } }

/* ── Početna — telefon u desnoj margini, prati skrol ──────────────
 * .gc-uz-tel obuhvata sve od ispod slajdera do footera; .gc-bocni je
 * apsolutno postavljen preko desne margine cijele te visine, a telefon u
 * njemu je sticky — pa ne ide iznad slajdera niti ispod footera.
 * Margina = (širina − 1200px sadržaja) / 2; telefon se vidi samo kad stane. */
.gc-uz-tel { position:relative; }
.gc-bocni { display:none; }
@media (min-width:1580px) {
  .gc-bocni {
    display:block; position:absolute; z-index:6; top:0; bottom:0;
    left:calc(50% + 600px); right:0; pointer-events:none;
    overflow:clip; /* sjaj ne smije praviti horizontalni skrol; clip (ne hidden) ne kvari sticky */
  }
  .gc-bocni-in {
    position:sticky; top:calc(var(--header-h, 72px) + 28px);
    display:flex; flex-direction:column; align-items:center; gap:14px;
    padding:36px 0 40px;
  }
  .gc-bocni-tel, .gc-bocni-cta { pointer-events:auto; }
  .gc-bocni-tel { display:block; animation:gcUlaz 1.1s cubic-bezier(.16,1,.3,1) .3s both; }
  .gc-bocni .gc-phone { zoom:.55; }
  .gc-bocni .gc-chip { display:none; }
  .gc-bocni-cta {
    display:inline-flex; align-items:center; gap:8px; padding:9px 14px 9px 10px; border-radius:99px;
    background:#0b1f3b; color:#fff; text-decoration:none; white-space:nowrap;
    font:800 12.5px 'Plus Jakarta Sans', sans-serif;
    box-shadow:0 12px 26px -14px rgba(11,31,59,.7);
    transition:transform .22s cubic-bezier(.16,1,.3,1), box-shadow .22s;
  }
  .gc-bocni-cta .gc-znak { width:18px; height:18px; }
  .gc-bocni-cta b { color:#e1b863; transition:transform .22s; }
  .gc-bocni-cta:hover { transform:translateY(-2px); box-shadow:0 16px 30px -14px rgba(11,31,59,.8); }
  .gc-bocni-cta:hover b { transform:translateX(3px); }
}
@media (min-width:1720px) { .gc-bocni .gc-phone { zoom:.7; } }
@media (min-width:1880px) { .gc-bocni .gc-phone { zoom:.85; } }
/* niski ekrani: telefon mora stati u visinu prozora */
@media (min-width:1580px) and (max-height:760px) { .gc-bocni .gc-phone { zoom:.55; } }
@keyframes gcUlaz { from { opacity:0; transform:translateY(40px) scale(.96); } to { opacity:1; transform:none; } }
/* ── Plutajuće dugme „Preuzmi app" (telefon, tablet, manji ekrani) ───
 * Uđe sa desne strane, kratko pokaže natpis pa se skupi u krug koji
 * povremeno „zatalasa". Gdje postoji bočni telefon (≥1580px) — ne prikazuje se. */
.gc-fab {
  position:fixed; z-index:60; right:14px; bottom:calc(18px + env(safe-area-inset-bottom, 0px));
  display:flex; align-items:center; gap:10px; height:58px; padding:6px 18px 6px 6px; border-radius:99px;
  background:linear-gradient(135deg,#0b1f3b,#1b3561); color:#fff; text-decoration:none;
  box-shadow:0 16px 34px -12px rgba(11,31,59,.65), 0 0 0 1px rgba(225,184,99,.35) inset;
  animation:gcFabUlaz .8s cubic-bezier(.34,1.56,.64,1) 1s both;
  transition:padding .45s cubic-bezier(.16,1,.3,1), gap .45s, transform .2s;
  -webkit-tap-highlight-color:transparent;
}
.gc-fab:active { transform:scale(.95); }
.gc-fab:focus-visible { outline:2px solid #e1b863; outline-offset:3px; }
@keyframes gcFabUlaz { from { transform:translateX(140%); opacity:0; } to { transform:none; opacity:1; } }
.gc-fab-ic {
  position:relative; width:46px; height:46px; flex:none; border-radius:50%; display:grid; place-items:center;
  background:linear-gradient(145deg,#e1b863,#d4a547); color:#0b1f3b;
}
.gc-fab-ic .gc-znak { width:26px; height:26px; color:#0b1f3b; animation:gcFabZnak 5.2s ease-in-out 2s infinite; }
.gc-fab-str { position:absolute; inset:0; display:grid; place-items:center; opacity:0; animation:gcFabStr 5.2s ease-in-out 2s infinite; }
.gc-fab-str svg { width:22px; height:22px; fill:none; stroke:#0b1f3b; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
/* znak aplikacije i strelica „preuzmi" se smjenjuju */
@keyframes gcFabZnak { 0%,40% { opacity:1; transform:none; } 48%,88% { opacity:0; transform:translateY(-8px); } 96%,100% { opacity:1; transform:none; } }
@keyframes gcFabStr { 0%,40% { opacity:0; transform:translateY(-8px); } 48%,62% { opacity:1; transform:none; } 70% { transform:translateY(3px); } 78%,88% { opacity:1; transform:none; } 96%,100% { opacity:0; } }
.gc-fab-ring { position:absolute; left:6px; top:6px; width:46px; height:46px; border-radius:50%; pointer-events:none;
  box-shadow:0 0 0 0 rgba(225,184,99,.7); animation:gcFabTalas 2.6s ease-out 2s infinite; }
@keyframes gcFabTalas { 0% { box-shadow:0 0 0 0 rgba(225,184,99,.65); } 80%,100% { box-shadow:0 0 0 18px rgba(225,184,99,0); } }
.gc-fab-t { display:flex; flex-direction:column; line-height:1.15; white-space:nowrap; overflow:hidden; max-width:160px;
  transition:max-width .45s cubic-bezier(.16,1,.3,1), opacity .3s; }
.gc-fab-t small { font:600 10.5px 'Inter',sans-serif; color:rgba(255,255,255,.7); }
.gc-fab-t b { font:800 15px 'Plus Jakarta Sans',sans-serif; }
.gc-fab.je-skupljen { padding-right:6px; gap:0; }
.gc-fab.je-skupljen .gc-fab-t { max-width:0; opacity:0; }
@media (min-width:1580px) { .gc-fab { display:none; } }
@media (prefers-reduced-motion: reduce) {
  .gc-fab, .gc-fab-ring, .gc-fab-ic .gc-znak, .gc-fab-str { animation:none !important; }
}

/* ── Dugmad za prodavnice ────────────────────────────────────────── */
.gc-store-grupa { display:flex; flex-wrap:wrap; gap:10px; align-items:stretch; }
.gc-store {
  position:relative; display:inline-flex; align-items:center; gap:10px; min-width:158px; padding:9px 16px 9px 13px; border-radius:14px;
  background:#05070c; color:#fff; text-decoration:none; border:1px solid rgba(255,255,255,.16);
  transition:transform .22s cubic-bezier(.16,1,.3,1), box-shadow .22s, border-color .22s;
}
.gc-store:hover { transform:translateY(-2px); box-shadow:0 14px 28px -14px rgba(0,0,0,.6); border-color:rgba(255,255,255,.35); }
.gc-store:focus-visible { outline:2px solid #e1b863; outline-offset:3px; }
.gc-store > svg { width:24px; height:24px; flex:none; }
.gc-store > span { display:flex; flex-direction:column; line-height:1.15; }
.gc-store small { font-size:10.5px; opacity:.78; }
.gc-store b { font:700 16px 'Plus Jakarta Sans',sans-serif; letter-spacing:-.01em; }
.gc-store.je-uskoro { opacity:.55; cursor:default; }
.gc-store.je-uskoro:hover { transform:none; box-shadow:none; }
.gc-store--web { background:linear-gradient(135deg,#d4a547,#e1b863); color:#0b1f3b; border-color:transparent; }
.gc-store--web .gc-znak { color:#0b1f3b; }
.gc-store--web small { opacity:.75; }
.gc-tvoj { display:none; position:absolute; top:-9px; right:10px; padding:2px 8px; border-radius:99px; font:800 9px 'Plus Jakarta Sans',sans-serif; font-style:normal;
  letter-spacing:.04em; text-transform:uppercase; background:#16a34a; color:#fff; box-shadow:0 6px 12px -6px rgba(22,163,74,.8); }
.gc-store.je-tvoj { box-shadow:0 0 0 2px rgba(225,184,99,.9), 0 16px 30px -14px rgba(212,165,71,.7); animation:gcTvoj 2.4s ease-in-out infinite; }
.gc-store.je-tvoj .gc-tvoj { display:block; }
@keyframes gcTvoj { 0%,100% { box-shadow:0 0 0 2px rgba(225,184,99,.9), 0 16px 30px -14px rgba(212,165,71,.7); } 50% { box-shadow:0 0 0 5px rgba(225,184,99,.35), 0 16px 30px -14px rgba(212,165,71,.7); } }
/* Na telefonu: tvoja prodavnica preko cijele širine, ostale ispod */
@media (max-width:640px) {
  .gc-store-grupa.pametno .gc-store { flex:1 1 calc(50% - 5px); min-width:0; }
  .gc-store-grupa.pametno .gc-store.je-tvoj { flex-basis:100%; justify-content:center; padding:13px 16px; }
  .gc-store-grupa.pametno .gc-store.je-tvoj b { font-size:18px; }
}

/* ── Strana /aplikacija ──────────────────────────────────────────── */
.gc-page { background:var(--bg,#fafaf7); }
.gc-hero {
  position:relative; overflow:hidden; color:#fff; padding:calc(var(--header-h,72px) + 56px) 0 90px;
  background:radial-gradient(90% 70% at 85% 30%, rgba(212,165,71,.22), transparent 60%),
             radial-gradient(70% 60% at 10% 90%, rgba(37,99,235,.25), transparent 60%),
             linear-gradient(160deg, #06142e 0%, #0b1f3b 55%, #132a52 100%);
}
.gc-hero::after { content:''; position:absolute; inset:0; pointer-events:none; opacity:.35;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:64px 64px; mask-image:radial-gradient(80% 70% at 50% 40%, #000, transparent); -webkit-mask-image:radial-gradient(80% 70% at 50% 40%, #000, transparent); }
.gc-hero-in { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:48px; align-items:center; }
.gc-eyebrow { display:inline-flex; align-items:center; gap:9px; padding:6px 12px 6px 7px; border-radius:99px; background:rgba(255,255,255,.08); border:1px solid rgba(225,184,99,.35);
  font:700 12.5px 'Plus Jakarta Sans',sans-serif; color:#f5e4bd; }
.gc-eyebrow .gc-znak { width:22px; height:22px; }
.gc-hero h1 { color:#fff; margin:18px 0 14px; font:800 clamp(2.4rem,5vw,3.9rem)/1.04 'Plus Jakarta Sans',sans-serif; letter-spacing:-.045em; }
.gc-hero h1 em { font-family:'Fraunces',Georgia,serif; font-style:italic; font-weight:500; color:#e1b863; }
.gc-hero .gc-lead { max-width:540px; font-size:1.12rem; line-height:1.65; color:rgba(255,255,255,.78); margin:0 0 26px; }
.gc-hero-mini { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:20px; font-size:13px; color:rgba(255,255,255,.7); }
.gc-hero-mini span { display:inline-flex; align-items:center; gap:6px; }
.gc-hero-mini span::before { content:''; width:6px; height:6px; border-radius:50%; background:#e1b863; }
.gc-hero-tel { display:flex; justify-content:center; animation:gcUlaz 1.1s cubic-bezier(.16,1,.3,1) .2s both; }

.gc-sec { padding:clamp(4rem,8vw,6.5rem) 0; }
.gc-sec-hd { max-width:660px; margin:0 auto 46px; text-align:center; }
.gc-sec-hd .gc-k { font:800 12px 'Plus Jakarta Sans',sans-serif; letter-spacing:.16em; text-transform:uppercase; color:#b8892f; }
.gc-sec-hd h2 { margin:10px 0 12px; font:800 clamp(1.9rem,3.6vw,2.7rem)/1.12 'Plus Jakarta Sans',sans-serif; letter-spacing:-.035em; color:var(--ink,#0f172a); }
.gc-sec-hd h2 em { font-family:'Fraunces',Georgia,serif; font-style:italic; font-weight:500; color:#b8892f; }
.gc-sec-hd p { margin:0; font-size:1.05rem; line-height:1.65; color:var(--muted,#64748b); }

/* Šta dobijaš — kartice */
.gc-feat { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.gc-f { position:relative; padding:26px 24px; border-radius:22px; background:#fff; border:1px solid var(--line,#e5e7eb); overflow:hidden;
  transition:transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s, border-color .3s; }
.gc-f:hover { transform:translateY(-4px); box-shadow:0 24px 46px -26px rgba(11,31,59,.35); border-color:rgba(212,165,71,.55); }
.gc-f-ic { width:52px; height:52px; border-radius:16px; display:grid; place-items:center; margin-bottom:16px; color:#fff; }
.gc-f-ic svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.gc-f h3 { margin:0 0 7px; font:800 18px 'Plus Jakarta Sans',sans-serif; letter-spacing:-.02em; color:var(--ink,#0f172a); }
.gc-f p { margin:0; font-size:14.5px; line-height:1.6; color:var(--muted,#64748b); }
.gc-f-za { display:inline-block; margin-top:14px; font:700 11px 'Plus Jakarta Sans',sans-serif; padding:3px 9px; border-radius:99px; background:#f4f3ee; color:#64748b; }

/* Dan sa aplikacijom — vremenska linija */
.gc-dan { position:relative; max-width:860px; margin:0 auto; }
.gc-dan::before { content:''; position:absolute; left:79px; top:6px; bottom:6px; width:2px; background:var(--line,#e5e7eb); }
.gc-dan-linija { position:absolute; left:79px; top:6px; width:2px; height:0; background:linear-gradient(#d4a547,#2563eb); transition:height 1.6s cubic-bezier(.16,1,.3,1); }
.gc-dan.in .gc-dan-linija { height:calc(100% - 12px); }
.gc-dan-st { position:relative; display:grid; grid-template-columns:62px 36px 1fr; gap:0 14px; align-items:start; padding:10px 0 22px; }
.gc-dan-st time { font:800 14px 'Plus Jakarta Sans',sans-serif; color:var(--ink,#0f172a); text-align:right; padding-top:9px; }
.gc-dan-tc { position:relative; z-index:1; width:36px; height:36px; border-radius:50%; display:grid; place-items:center; background:#fff; border:2px solid var(--line,#e5e7eb); color:#94a3b8; transition:all .5s; }
.gc-dan-tc svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.gc-dan-st.in .gc-dan-tc { border-color:#d4a547; color:#b8892f; box-shadow:0 0 0 6px rgba(212,165,71,.14); }
.gc-dan-k { padding:16px 18px; border-radius:18px; background:#fff; border:1px solid var(--line,#e5e7eb); box-shadow:0 10px 26px -20px rgba(11,31,59,.35); }
.gc-dan-k b { display:block; font:800 16px 'Plus Jakarta Sans',sans-serif; color:var(--ink,#0f172a); margin-bottom:4px; }
.gc-dan-k p { margin:0; font-size:14.5px; line-height:1.55; color:var(--muted,#64748b); }
.gc-dan-k .gc-mini-push { display:flex; align-items:center; gap:9px; margin-top:12px; padding:9px 12px; border-radius:14px; background:#0b1730; color:#fff; font-size:12.5px; }
.gc-dan-k .gc-mini-push .gc-znak { width:18px; height:18px; }

/* Uputstvo — koraci */
.gc-koraci { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; counter-reset:k; }
.gc-kor { position:relative; padding:26px 22px 24px; border-radius:22px; background:#fff; border:1px solid var(--line,#e5e7eb); }
.gc-kor-n { width:42px; height:42px; border-radius:13px; display:grid; place-items:center; margin-bottom:14px; font:800 18px 'Plus Jakarta Sans',sans-serif; color:#0b1f3b; background:linear-gradient(135deg,#d4a547,#e1b863); box-shadow:0 10px 20px -10px rgba(212,165,71,.7); }
.gc-kor h3 { margin:0 0 7px; font:800 17px 'Plus Jakarta Sans',sans-serif; color:var(--ink,#0f172a); }
.gc-kor p { margin:0; font-size:14px; line-height:1.6; color:var(--muted,#64748b); }
.gc-kor code { font:700 13px 'Plus Jakarta Sans',sans-serif; padding:1px 6px; border-radius:6px; background:#fdf3dc; color:#7a5511; letter-spacing:.06em; }
.gc-kor:not(:last-child)::after { content:'→'; position:absolute; right:-14px; top:38px; z-index:1; width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background:#fff; border:1px solid var(--line,#e5e7eb); font-size:13px; color:#b8892f; }

/* Za koga */
.gc-ko { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.gc-ko-k { padding:26px; border-radius:22px; background:linear-gradient(160deg,#0b1f3b,#132a52); color:#fff; }
.gc-ko-k h3 { color:#fff; margin:0 0 12px; font:800 19px 'Plus Jakarta Sans',sans-serif; }
.gc-ko-k ul { margin:0; padding:0; list-style:none; display:grid; gap:9px; }
.gc-ko-k li { position:relative; padding-left:22px; font-size:14.5px; line-height:1.5; color:rgba(255,255,255,.82); }
.gc-ko-k li::before { content:''; position:absolute; left:0; top:7px; width:9px; height:9px; border-radius:3px; background:#e1b863; }

/* FAQ */
.gc-faq { max-width:780px; margin:0 auto; display:grid; gap:10px; }
.gc-faq details { border-radius:16px; background:#fff; border:1px solid var(--line,#e5e7eb); padding:0 20px; }
.gc-faq summary { cursor:pointer; list-style:none; padding:18px 0; font:800 16px 'Plus Jakarta Sans',sans-serif; color:var(--ink,#0f172a); display:flex; justify-content:space-between; gap:12px; }
.gc-faq summary::-webkit-details-marker { display:none; }
.gc-faq summary::after { content:'+'; font-size:22px; line-height:1; color:#b8892f; transition:transform .25s; }
.gc-faq details[open] summary::after { transform:rotate(45deg); }
.gc-faq details p { margin:0 0 18px; font-size:15px; line-height:1.65; color:var(--muted,#64748b); }

/* Završna traka */
.gc-cta { position:relative; overflow:hidden; border-radius:32px; padding:clamp(2.4rem,5vw,3.6rem); color:#fff; text-align:center;
  background:radial-gradient(70% 90% at 80% 10%, rgba(212,165,71,.3), transparent 60%), linear-gradient(150deg,#06142e,#132a52); }
.gc-cta h2 { color:#fff; margin:0 0 10px; font:800 clamp(1.8rem,3.4vw,2.5rem)/1.15 'Plus Jakarta Sans',sans-serif; letter-spacing:-.03em; }
.gc-cta h2 em { font-family:'Fraunces',Georgia,serif; font-style:italic; font-weight:500; color:#e1b863; }
.gc-cta p { margin:0 auto 24px; max-width:520px; color:rgba(255,255,255,.75); line-height:1.6; }
.gc-cta .gc-store-grupa { justify-content:center; }

/* Pojavljivanje pri skrolu */
.gc-rv { opacity:0; transform:translateY(26px); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.gc-rv.in { opacity:1; transform:none; }
.gc-feat .gc-rv:nth-child(2), .gc-koraci .gc-rv:nth-child(2), .gc-ko .gc-rv:nth-child(2) { transition-delay:.08s; }
.gc-feat .gc-rv:nth-child(3), .gc-koraci .gc-rv:nth-child(3), .gc-ko .gc-rv:nth-child(3) { transition-delay:.16s; }
.gc-feat .gc-rv:nth-child(5), .gc-koraci .gc-rv:nth-child(4) { transition-delay:.24s; }
.gc-feat .gc-rv:nth-child(6) { transition-delay:.32s; }

@media (max-width:1000px) {
  .gc-hero-in { grid-template-columns:1fr; text-align:center; }
  .gc-hero .gc-lead { margin-left:auto; margin-right:auto; }
  .gc-hero .gc-store-grupa, .gc-hero-mini { justify-content:center; }
  .gc-feat, .gc-ko { grid-template-columns:1fr 1fr; }
  .gc-koraci { grid-template-columns:1fr 1fr; }
  .gc-kor:nth-child(2)::after { display:none; }
  .gc-chip.c1 { left:-60px; } .gc-chip.c2 { right:-50px; } .gc-chip.c3 { left:-40px; }
}
@media (max-width:640px) {
  .gc-feat, .gc-ko, .gc-koraci { grid-template-columns:1fr; }
  .gc-kor::after { display:none !important; }
  .gc-phone { zoom:.84; }
  .gc-chip { display:none; }
  .gc-dan::before, .gc-dan-linija { left:60px; }
  .gc-dan-st { grid-template-columns:46px 30px 1fr; gap:0 10px; }
  .gc-dan-tc { width:30px; height:30px; }
  .gc-dan-st time { font-size:12px; }
}

@media (prefers-reduced-motion: reduce) {
  .gc-phone-frame, .gc-glow, .gc-chip, .gc-store.je-tvoj, .hero-app-mob::before, .gc-sada-t small i { animation:none !important; }
  .gc-rv { opacity:1; transform:none; transition:none; }
  .gc-red { opacity:1; transform:none; animation:none !important; }
  .gc-pr i em { width:var(--w); animation:none !important; }
  .gc-ek, .gc-push { transition:none; }
}

/* =====================================================================
 * „Prvi ulazak" — koraci lijevo, listić + telefon desno (Igor 2026-10-03)
 * Ekrani prate prave ekrane aplikacije (svijetla tema). Stanje nosi
 * [data-k] na .gc-pu; js/aplikacija.js ga mijenja.
 * ===================================================================== */
.gc-pu { display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:56px; align-items:center; }
.gc-pu-koraci { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.gc-pu-k {
  position:relative; width:100%; display:flex; align-items:flex-start; gap:14px; text-align:left; cursor:pointer;
  padding:14px 16px; border-radius:18px; border:1px solid transparent; background:transparent; overflow:hidden;
  font:inherit; color:inherit; transition:background .35s, border-color .35s, box-shadow .35s;
}
.gc-pu-k:hover { background:rgba(255,255,255,.6); }
.gc-pu-k:focus-visible { outline:2px solid #d4a547; outline-offset:2px; }
.gc-pu-k.is-on { background:#fff; border-color:var(--line,#e5e7eb); box-shadow:0 18px 36px -24px rgba(11,31,59,.45); }
.gc-pu-n {
  width:34px; height:34px; flex:none; border-radius:11px; display:grid; place-items:center;
  font:800 15px 'Plus Jakarta Sans',sans-serif; background:#f1efe8; color:#64748b; transition:all .35s;
}
.gc-pu-k.is-on .gc-pu-n { background:linear-gradient(135deg,#d4a547,#e1b863); color:#0b1f3b; box-shadow:0 8px 18px -8px rgba(212,165,71,.8); }
.gc-pu-k.je-prosao .gc-pu-n { background:#dcfce7; color:#16a34a; font-size:0; }
.gc-pu-k.je-prosao .gc-pu-n::before { content:'✓'; font-size:16px; }
.gc-pu-t { display:flex; flex-direction:column; min-width:0; padding-top:6px; }
.gc-pu-t b { font:800 16px 'Plus Jakarta Sans',sans-serif; color:var(--ink,#0f172a); }
.gc-pu-k:not(.is-on) .gc-pu-t b { color:#64748b; }
.gc-pu-t i { font-style:normal; font-size:14px; line-height:1.55; color:var(--muted,#64748b);
  max-height:0; opacity:0; overflow:hidden; transition:max-height .45s cubic-bezier(.16,1,.3,1), opacity .35s, margin .35s; }
.gc-pu-k.is-on .gc-pu-t i { max-height:90px; opacity:1; margin-top:4px; }
.gc-pu-bar { position:absolute; left:16px; right:16px; bottom:0; height:3px; border-radius:3px; overflow:hidden; }
.gc-pu-bar em { display:block; height:100%; width:0; background:linear-gradient(90deg,#d4a547,#e1b863); }
.gc-pu-k.is-on .gc-pu-bar em { animation:gcPuBar var(--traje,4200ms) linear forwards; }
@keyframes gcPuBar { to { width:100%; } }

/* scena */
.gc-pu-scena { position:relative; height:600px; }
.gc-pu-scena::before { content:''; position:absolute; inset:8% 4% 6% 10%; border-radius:50%;
  background:radial-gradient(closest-side, rgba(212,165,71,.22), rgba(37,99,235,.08) 60%, transparent 75%); filter:blur(10px); }
.gc-pu-tel { position:absolute; right:6%; top:0; zoom:.96; z-index:2; transition:transform .7s cubic-bezier(.16,1,.3,1), opacity .5s, filter .5s; }
.gc-pu-tel .gc-phone-frame { animation:none; }
.gc-pe-wrap { position:absolute; inset:46px 0 0; }

/* listić — isti raspored kao odštampani (cms/views/print_layout.php) */
.gc-listic {
  position:absolute; z-index:3; left:0; top:120px; width:300px; padding:16px 18px 18px;
  background:#fff; border:1px solid #e3e6ec; border-radius:4px; color:#16202f;
  font-family:'Inter',sans-serif; box-shadow:0 1px 0 #e3e6ec, 0 26px 44px -24px rgba(16,28,48,.55);
  transform:rotate(-7deg) translateX(-10px); transform-origin:60% 40%;
  transition:transform .8s cubic-bezier(.16,1,.3,1), opacity .5s;
}
.gc-listic::after { content:''; position:absolute; left:0; right:0; bottom:-1px; height:6px;
  background:repeating-linear-gradient(90deg,#d5d9e1 0 5px,transparent 5px 10px); }
.gc-listic-mak { position:absolute; top:-12px; right:16px; font-size:15px; color:#94a3b8; transform:rotate(90deg); }
.gc-listic-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; border-bottom:1px solid #eef0f4; padding-bottom:9px; margin-bottom:11px; }
.gc-listic-ime { font:600 16px Georgia,'Times New Roman',serif; letter-spacing:-.01em; }
.gc-listic-odj { font:500 12px 'Inter',sans-serif; color:#64748b; }
.gc-listic-red { display:flex; gap:10px; align-items:baseline; font-size:13px; margin:0 -6px 6px; padding:3px 6px; border-radius:6px; transition:background .4s, box-shadow .4s; }
.gc-listic-red > span { color:#64748b; min-width:92px; font-size:11.5px; }
.gc-listic-red b { font-weight:600; }
.gc-listic-sifra b { font-size:18px; letter-spacing:.2em; }
.gc-listic-kod { display:inline-block; background:#fdf6e6; border:1px solid #ecd9ab; color:#7a5511; border-radius:5px; padding:2px 8px; letter-spacing:.09em; font-size:12px; }
.gc-listic-dno { margin-top:11px; padding-top:9px; border-top:1px dashed #e3e6ec; font-size:10.5px; color:#64748b; line-height:1.5; }

/* stanja scene po koraku */
.gc-pu[data-k="0"] .gc-listic { z-index:4; transform:rotate(-3deg) translate(70px,-30px) scale(1.12); }
.gc-pu[data-k="0"] .gc-pu-tel { transform:translateX(14px) scale(.96); }
.gc-pu[data-k="0"] .gc-listic-sifra { background:#fdf6e6; box-shadow:0 0 0 1.5px #ecd9ab; }
.gc-pu[data-k="2"] .gc-listic { z-index:4; transform:rotate(-4deg) translate(-56px,150px) scale(.95); }
.gc-pu[data-k="2"] .gc-listic-sifra { background:#fdf6e6; box-shadow:0 0 0 2px #d4a547; animation:gcSifraSija 1.6s ease-in-out infinite; }
@keyframes gcSifraSija { 50% { box-shadow:0 0 0 5px rgba(212,165,71,.35); } }
.gc-pu[data-k="3"] .gc-listic, .gc-pu[data-k="4"] .gc-listic, .gc-pu[data-k="5"] .gc-listic { transform:rotate(-10deg) translate(-40px,70px) scale(.9); opacity:.75; }

/* ekrani u telefonu */
.gc-pe { position:absolute; inset:0; padding:14px 18px 0; opacity:0; transform:translateX(24px); pointer-events:none;
  transition:opacity .5s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1); }
.gc-pe.is-on { opacity:1; transform:none; }
.gc-pe h5 { margin:4px 0 6px; font:800 20px/1.18 'Plus Jakarta Sans',sans-serif; letter-spacing:-.03em; color:var(--gc-ink); }
.gc-pe h5 em { font-family:'Fraunces',Georgia,serif; font-style:italic; font-weight:500; color:var(--gc-gold); }
.gc-pe p { margin:0 0 12px; font-size:10.5px; line-height:1.5; color:var(--gc-mut); }
.gc-pe-eye { display:block; margin-top:14px; font:800 8.5px 'Plus Jakarta Sans',sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--gc-gold); }
.gc-pe-brand { display:flex; align-items:center; gap:7px; margin-top:4px; }
.gc-pe-brand .gc-znak { width:24px; height:24px; color:#0b1f3b; }
.gc-pe-brand b, .gc-pe-splash > b { font:800 14px 'Plus Jakarta Sans',sans-serif; letter-spacing:-.02em; color:var(--gc-ink); }
.gc-pe-brand b i, .gc-pe-splash > b i { font-style:normal; color:#d4a547; }
.gc-pe-polje { position:relative; display:flex; flex-direction:column; gap:2px; padding:8px 12px; margin-bottom:7px; border-radius:13px; background:#fff; border:1px solid var(--gc-line); }
.gc-pe-polje span { font-size:8.5px; font-weight:600; color:var(--gc-mut); }
.gc-pe-polje i { font-style:normal; font:600 12px 'Inter',sans-serif; color:var(--gc-ink); min-height:15px; }
.gc-pe-polje svg { position:absolute; right:11px; top:50%; width:15px; height:15px; margin-top:-7px; fill:none; stroke:#94a3b8; stroke-width:1.8; }
.gc-pe-polje.akt { border-color:#d4a547; box-shadow:0 0 0 3px rgba(212,165,71,.16); }
.gc-pe-btn { position:relative; display:flex; align-items:center; justify-content:center; gap:7px; height:40px; margin-top:8px; border-radius:13px;
  font:800 12px 'Plus Jakarta Sans',sans-serif; overflow:hidden; }
.gc-pe-btn svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.gc-pe-btn.zl { background:linear-gradient(135deg,#d4a547,#e1b863); color:#0b1f3b; }
.gc-pe-btn.nv { background:#0b1f3b; color:#fff; }
.gc-pe-ili { display:block; text-align:center; margin-top:8px; font-size:9px; color:#94a3b8; }
.gc-pe-link { display:block; text-align:center; margin-top:10px; font:700 10px 'Inter',sans-serif; color:var(--gc-mut); text-decoration:underline; text-underline-offset:2px; }
.gc-pe.is-on .gc-pe-cilj { animation:gcCilj 1.2s ease-in-out .6s 2; }
@keyframes gcCilj { 50% { box-shadow:0 0 0 5px rgba(212,165,71,.35); } }
/* „dodir" prstom */
.gc-tap { position:absolute; left:50%; top:50%; width:30px; height:30px; margin:-15px 0 0 -15px; border-radius:50%;
  background:rgba(255,255,255,.55); box-shadow:0 0 0 2px rgba(255,255,255,.85); opacity:0; pointer-events:none; }
.gc-pe.is-on .gc-tap { animation:gcTap .9s ease-out 2.7s both; }
@keyframes gcTap { 0% { opacity:0; transform:scale(.4); } 25% { opacity:1; transform:scale(.8); } 100% { opacity:0; transform:scale(2.4); } }

/* uvodni ekran (tamnoplav, kao pravi) */
.gc-pe-splash { inset:-46px 0 0; padding:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  background:radial-gradient(70% 45% at 50% 45%, #15305c, #0b1f3b 70%); }
.gc-pe-splash > b { color:#fff; font-size:22px; margin-top:10px; }
.gc-pe-splash small { font:700 9px 'Inter',sans-serif; color:rgba(255,255,255,.65); }
.gc-pe-logo { position:relative; width:84px; height:84px; border-radius:50%; display:grid; place-items:center; }
.gc-pe-logo::before { content:''; position:absolute; inset:0; border-radius:50%; border:2px dashed rgba(225,184,99,.8); animation:gcVrti 9s linear infinite; }
.gc-pe-logo .gc-znak { width:54px; height:54px; color:#fff; }
@keyframes gcVrti { to { transform:rotate(360deg); } }
.gc-pu[data-k="0"] .gc-pu-tel .gc-status { --gc-ink:#fff; color:#fff; position:relative; z-index:3; }

/* koraci 1/3 – 3/3 */
.gc-pe-koraci { display:flex; align-items:center; gap:4px; margin-top:6px; }
.gc-pe-koraci i { flex:1; height:4px; border-radius:4px; background:var(--gc-line); }
.gc-pe-koraci i.on { background:#d4a547; }
.gc-pe-koraci b { margin-left:6px; font:800 9px 'Plus Jakarta Sans',sans-serif; color:var(--gc-mut); }

/* šest cifara — upisuju se jedna po jedna */
.gc-otp { display:grid; grid-template-columns:repeat(6,1fr); gap:6px; margin:4px 0 10px; }
.gc-otp i { height:42px; border-radius:11px; background:#fff; border:1.5px solid var(--gc-line); display:grid; place-items:center; }
.gc-otp b { font:800 18px 'Plus Jakarta Sans',sans-serif; color:var(--gc-ink); opacity:0; }
.gc-pe.is-on .gc-otp i { animation:gcOtpPolje .3s ease-out both; }
.gc-pe.is-on .gc-otp b { animation:gcOtpCifra .35s cubic-bezier(.34,1.56,.64,1) both; }
@keyframes gcOtpPolje { from { border-color:var(--gc-line); } to { border-color:#d4a547; box-shadow:0 0 0 3px rgba(212,165,71,.14); } }
@keyframes gcOtpCifra { from { opacity:0; transform:translateY(6px) scale(.6); } to { opacity:1; transform:none; } }
.gc-pe.is-on .gc-otp i:nth-child(1), .gc-pe.is-on .gc-otp i:nth-child(1) b { animation-delay:.5s; }
.gc-pe.is-on .gc-otp i:nth-child(2), .gc-pe.is-on .gc-otp i:nth-child(2) b { animation-delay:.88s; }
.gc-pe.is-on .gc-otp i:nth-child(3), .gc-pe.is-on .gc-otp i:nth-child(3) b { animation-delay:1.26s; }
.gc-pe.is-on .gc-otp i:nth-child(4), .gc-pe.is-on .gc-otp i:nth-child(4) b { animation-delay:1.64s; }
.gc-pe.is-on .gc-otp i:nth-child(5), .gc-pe.is-on .gc-otp i:nth-child(5) b { animation-delay:2.02s; }
.gc-pe.is-on .gc-otp i:nth-child(6), .gc-pe.is-on .gc-otp i:nth-child(6) b { animation-delay:2.4s; }
.gc-pe-traka { padding:8px 10px; border-radius:11px; background:#fdf6e6; border:1px solid #f1e2bd; font-size:9.5px; font-weight:600; color:#7a5511; }

/* kucanje (e-mail, lozinka) */
.gc-kuca { display:inline-block; white-space:nowrap; clip-path:inset(0 100% 0 0); }
.gc-pe.is-on .gc-kuca { animation:gcKucaj 1.9s steps(22, end) .5s forwards; }
.gc-pe.is-on .gc-tacke { animation:gcKucaj 1.4s steps(10, end) .5s forwards; }
@keyframes gcKucaj { to { clip-path:inset(0 0 0 0); } }
.gc-pe-ko { display:flex; align-items:center; gap:9px; padding:9px 11px; margin:8px 0 9px; border-radius:13px; background:#fff; border:1px solid var(--gc-line); }
.gc-pe-ko > span { width:30px; height:30px; border-radius:50%; display:grid; place-items:center; font:800 10px 'Plus Jakarta Sans',sans-serif; color:#0b1f3b; background:#fdf6e6; box-shadow:0 0 0 1.5px #d4a547; }
.gc-pe-ko b { flex:1; display:flex; flex-direction:column; font:800 11px 'Plus Jakarta Sans',sans-serif; color:var(--gc-ink); }
.gc-pe-ko b i { font-style:normal; font:500 9px 'Inter',sans-serif; color:var(--gc-mut); }
.gc-pe-ko em { font-style:normal; font:800 8px 'Plus Jakarta Sans',sans-serif; padding:4px 8px; border-radius:99px; background:#0b1f3b; color:#e1b863; }
.gc-pe-jacina { display:flex; align-items:center; gap:4px; margin:2px 0 4px; }
.gc-pe-jacina i { flex:1; height:4px; border-radius:4px; background:var(--gc-line); }
.gc-pe-jacina b { margin-left:6px; font:800 9px 'Plus Jakarta Sans',sans-serif; color:var(--gc-green); opacity:0; }
.gc-pe.is-on .gc-pe-jacina i { animation:gcJaka .3s ease-out forwards; }
.gc-pe.is-on .gc-pe-jacina i:nth-child(1) { animation-delay:.8s; } .gc-pe.is-on .gc-pe-jacina i:nth-child(2) { animation-delay:1.1s; }
.gc-pe.is-on .gc-pe-jacina i:nth-child(3) { animation-delay:1.4s; } .gc-pe.is-on .gc-pe-jacina i:nth-child(4) { animation-delay:1.7s; }
.gc-pe.is-on .gc-pe-jacina b { animation:gcPojavi .3s ease-out 1.9s forwards; }
@keyframes gcJaka { to { background:#1e9e5a; } }
@keyframes gcPojavi { to { opacity:1; } }

/* gotovo + dozvola za obavještenja */
.gc-pe-gotovo { display:flex; flex-direction:column; align-items:center; text-align:center; padding-top:40px; }
.gc-pe-gotovo p { padding:0 8px; }
.gc-pe-kva { width:74px; height:74px; margin-bottom:10px; }
.gc-pe-kva svg { width:100%; height:100%; fill:none; stroke-width:3.5; stroke-linecap:round; stroke-linejoin:round; }
.gc-pe-kva circle { stroke:#1e9e5a; fill:rgba(30,158,90,.1); stroke-dasharray:145; stroke-dashoffset:145; }
.gc-pe-kva path { stroke:#1e9e5a; stroke-dasharray:40; stroke-dashoffset:40; }
.gc-pe.is-on .gc-pe-kva circle { animation:gcCrtaj .7s ease-out .2s forwards; }
.gc-pe.is-on .gc-pe-kva path { animation:gcCrtaj .45s ease-out .8s forwards; }
@keyframes gcCrtaj { to { stroke-dashoffset:0; } }
.gc-dozvola { position:absolute; left:18px; right:18px; bottom:24px; padding:16px 14px 0; border-radius:18px; text-align:center;
  background:rgba(255,255,255,.97); box-shadow:0 24px 48px -16px rgba(15,23,42,.45), 0 0 0 1px rgba(15,23,42,.06);
  transform:translateY(130%); opacity:0; }
.gc-pe.is-on .gc-dozvola { animation:gcDozvola .6s cubic-bezier(.16,1,.3,1) 1.6s forwards; }
@keyframes gcDozvola { to { transform:none; opacity:1; } }
.gc-dozvola b { display:block; font:800 11.5px/1.3 'Plus Jakarta Sans',sans-serif; color:var(--gc-ink); }
.gc-dozvola > span { display:block; margin-top:4px; font-size:9.5px; color:var(--gc-mut); }
.gc-dozvola div { display:grid; grid-template-columns:1fr 1fr; margin:12px -14px 0; border-top:1px solid var(--gc-line); }
.gc-dozvola div i { position:relative; overflow:hidden; font-style:normal; padding:11px 0; font:600 11.5px 'Inter',sans-serif; color:#2563eb; }
.gc-dozvola div i + i { border-left:1px solid var(--gc-line); }
.gc-dozvola div i.da { font-weight:800; }
.gc-dozvola .gc-tap { background:rgba(37,99,235,.25); box-shadow:0 0 0 2px rgba(37,99,235,.3); }
.gc-pe.is-on .gc-dozvola .gc-tap { animation-delay:3.6s; }

/* manji ekrani: scena gore, koraci ispod */
@media (max-width:980px) {
  .gc-pu { grid-template-columns:1fr; gap:24px; }
  .gc-pu-scena { order:-1; height:540px; max-width:520px; width:100%; margin:0 auto; }
  .gc-pu-tel { right:0; zoom:.86; }
  .gc-listic { width:270px; top:150px; }
}
@media (max-width:560px) {
  .gc-pu-scena { height:470px; }
  .gc-pu-tel { zoom:.76; right:-6px; }
  .gc-listic { width:232px; padding:12px 13px 14px; top:150px; left:-4px; }
  .gc-listic-ime { font-size:14px; } .gc-listic-sifra b { font-size:15px; }
  .gc-listic-red > span { min-width:78px; font-size:10.5px; }
  .gc-listic-dno { font-size:9.5px; }
  .gc-pu[data-k="0"] .gc-listic { transform:rotate(-3deg) translate(40px,-60px) scale(1.08); }
  .gc-pu[data-k="2"] .gc-listic { transform:rotate(-4deg) translate(-6px,110px) scale(.92); }
  .gc-pu[data-k="3"] .gc-listic, .gc-pu[data-k="4"] .gc-listic, .gc-pu[data-k="5"] .gc-listic { transform:rotate(-10deg) translate(-70px,150px) scale(.8); opacity:.6; }
  .gc-pu-k { padding:12px; }
}
@media (prefers-reduced-motion: reduce) {
  .gc-pe-logo::before, .gc-pu-k.is-on .gc-pu-bar em, .gc-pu[data-k="2"] .gc-listic-sifra { animation:none !important; }
  .gc-pe.is-on .gc-otp b, .gc-pe.is-on .gc-kuca, .gc-pe.is-on .gc-dozvola, .gc-pe.is-on .gc-pe-kva circle, .gc-pe.is-on .gc-pe-kva path,
  .gc-pe.is-on .gc-pe-jacina i, .gc-pe.is-on .gc-pe-jacina b { animation-duration:.01s !important; animation-delay:0s !important; }
}