/* ══════════════════════════════════════════
   GG KONFIGURATOR — samostalni stilovi
   Ne oslanja se na varijable teme.
══════════════════════════════════════════ */
.ggk {
  --k-green:#1C4030; --k-mid:#2B5C3E; --k-light:#c8e6c0;
  --k-amber:#F0A93B; --k-cream:#FBF9F2; --k-ink:#14211b;
  --k-line:rgba(28,64,48,.14);
  font-family:'DM Sans',system-ui,-apple-system,sans-serif;
  color:var(--k-ink); line-height:1.6;
}
.ggk *{box-sizing:border-box}

.ggk__intro{margin-bottom:44px}
.ggk__eyebrow{font-size:10px;font-weight:500;letter-spacing:4px;text-transform:uppercase;color:var(--k-mid);margin:0 0 14px}
.ggk__title{font-family:'Bebas Neue',sans-serif;font-size:clamp(34px,5vw,64px);line-height:1;letter-spacing:1px;color:var(--k-green);margin:0 0 16px}
.ggk__sub{font-size:16px;line-height:1.7;color:#5a6b61;max-width:620px;margin:0}

.ggk__grid{display:grid;grid-template-columns:1fr 1.2fr;gap:44px;align-items:start}

/* ── kontrole ── */
.ggk__ctrl{margin-bottom:28px}
.ggk__ctrl h3{font-family:inherit;font-size:13px;font-weight:500;letter-spacing:.3px;color:var(--k-green);margin:0 0 11px;text-transform:none}
.ggk__hint{font-size:12.5px;color:#7d8b83;margin:8px 0 0}

.ggk__steps{display:flex;gap:6px}
.ggk__steps button{
  flex:1;padding:13px 0;text-align:center;cursor:pointer;
  border:1px solid var(--k-line);background:#fff;
  font-family:'Bebas Neue',sans-serif;font-size:21px;letter-spacing:1px;
  color:#8b998f;transition:all .16s;border-radius:0;
}
.ggk__steps button:hover{border-color:var(--k-mid);color:var(--k-mid)}
.ggk__steps button[aria-pressed="true"]{background:var(--k-green);border-color:var(--k-green);color:#fff}
.ggk__steps button:focus-visible{outline:2px solid var(--k-amber);outline-offset:2px}

.ggk__pair{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.ggk__trio{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}
.ggk__opt{
  padding:14px 15px;cursor:pointer;text-align:left;font-family:inherit;
  border:1px solid var(--k-line);background:#fff;transition:all .16s;border-radius:0;
}
.ggk__opt:hover{border-color:var(--k-mid)}
.ggk__opt[aria-pressed="true"]{border-color:var(--k-green);background:#f2f7f3;box-shadow:inset 3px 0 0 var(--k-green)}
.ggk__opt:focus-visible{outline:2px solid var(--k-amber);outline-offset:2px}
.ggk__opt b{display:block;font-size:14.5px;font-weight:500;color:var(--k-ink);margin-bottom:3px}
.ggk__opt span{display:block;font-size:12px;color:#7d8b83;line-height:1.45}

/* ── panel ── */
.ggk__panel{position:sticky;top:100px}

.ggk__planbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--k-line);border-bottom:none;padding:12px 16px;
}
.ggk__planbar-label{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#8b998f}
.ggk__presets{display:flex;gap:4px;flex-wrap:wrap}
.ggk__presets button{
  padding:7px 13px;cursor:pointer;font-family:inherit;font-size:12px;
  border:1px solid var(--k-line);background:#fff;color:#7d8b83;transition:all .16s;border-radius:0;
}
.ggk__presets button:hover{border-color:var(--k-mid);color:var(--k-mid)}
.ggk__presets button.is-on{background:var(--k-green);border-color:var(--k-green);color:#fff}

.ggk__plan{background:#fff;border:1px solid var(--k-line);padding:18px 18px 10px}
.ggk__plan svg{width:100%;height:auto;display:block;touch-action:none}
.ggk__planhelp{font-size:11.5px;color:#9aa8a0;text-align:center;margin:10px 0 0}
.ggk-mod{transition:opacity .12s}
.ggk-mod:hover{opacity:.86}

.ggk__legend{
  display:flex;gap:16px;align-items:center;flex-wrap:wrap;
  font-size:12px;color:#7d8b83;padding:11px 18px;
  background:#fff;border:1px solid var(--k-line);border-top:none;
}
.ggk__sw{display:inline-block;width:11px;height:11px;margin-right:6px;vertical-align:-1px}
.ggk__sw--s{background:#2B5C3E}
.ggk__sw--t{background:#e8d9b8;border:1px solid #c9b285}
.ggk__dims{margin-left:auto;color:#9aa8a0}

/* ── cijena ── */
.ggk__price{background:var(--k-green);color:#fff;padding:26px 24px}
.ggk__row{display:flex;justify-content:space-between;gap:16px;font-size:13.5px;padding:7px 0;color:rgba(255,255,255,.78)}
.ggk__row--sum{border-top:1px solid rgba(255,255,255,.18);margin-top:10px;padding-top:14px}
.ggk__area{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.18);font-size:13.5px;color:rgba(255,255,255,.78)}
.ggk__area b{font-weight:600;color:#fff}
.ggk__total{display:flex;justify-content:space-between;align-items:baseline;margin-top:14px;padding-top:16px;border-top:2px solid var(--k-light)}
.ggk__total span{font-size:13px;color:var(--k-light)}
.ggk__total b{font-family:'Bebas Neue',sans-serif;font-size:42px;letter-spacing:1px;color:#fff;line-height:1}
.ggk__pdv{font-size:12.5px;color:rgba(255,255,255,.6);margin:8px 0 0;text-align:right}
.ggk__m2{font-size:12.5px;color:var(--k-light);margin:2px 0 0;text-align:right}
.ggk__cta{
  display:block;margin-top:20px;padding:16px;text-align:center;
  background:var(--k-amber);color:var(--k-ink);text-decoration:none;
  font-size:12px;font-weight:500;letter-spacing:2px;text-transform:uppercase;
  transition:background .2s,color .2s;
}
.ggk__cta:hover{background:#fff;color:var(--k-green)}
/* Napomena ispod CTA — skida dojam da upit obvezuje na bas tu konfiguraciju */
.ggk__ctanote{font-size:11.5px;line-height:1.55;color:rgba(255,255,255,.55);margin:11px 0 0;text-align:center}

.ggk__note{
  font-size:12.5px;color:#6b7a71;line-height:1.6;margin:0;
  background:#fff;border:1px solid var(--k-line);border-top:none;padding:16px 18px;
}

@media (max-width:900px){
  .ggk__grid{grid-template-columns:1fr;gap:30px}
  .ggk__panel{position:static}
}
@media (max-width:560px){
  .ggk__trio,.ggk__pair{grid-template-columns:1fr}
  .ggk__dims{margin-left:0;width:100%}
}
@media (prefers-reduced-motion:reduce){.ggk *{transition:none!important}}
