
:root{--radius-2xl:1.25rem}
.py-6{padding-top:4rem;padding-bottom:4rem}
.hero{min-height:70vh}
.hero-img{object-fit:cover;filter:brightness(.82)}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.25) 40%,rgba(0,0,0,.35))}
.navbar .btn-group .btn.active{background:#111;color:#fff}
.card{border-radius:var(--radius-2xl)}
.btn{border-radius:.8rem}
#about .text-secondary{line-height:1.8}
#about .collapse{margin-top:.25rem}
.services-grid{display:grid;grid-template-columns:1fr;gap:1rem}
@media (min-width:992px){.services-grid{grid-template-columns:1fr 1fr}}
.service-group.card{border-radius:1rem;border:1px solid rgba(0,0,0,.06);box-shadow:0 1px 2px rgba(0,0,0,.04)}
.service-group .card-body{padding:1rem 1.25rem}
.service-group h6{margin-bottom:.35rem}
.service-group ul{margin:0;padding-left:0;list-style:none}
.service-group ul li{position:relative;padding-left:1.15rem;margin-bottom:.35rem}
.service-group ul li::before{content:"✓";position:absolute;left:0;top:0;line-height:1}
.pricing-card.card{border-radius:1rem;background:rgba(0,0,0,.02);border:1px dashed rgba(0,0,0,.08)}
.pricing-card .card-body{padding:1rem 1.25rem}
.company{line-height:1.4}

/* --- Services estetska dorada --- */
:root{
  --acc1:#C8A27A; /* clay */
  --acc2:#8AA099; /* sage */
  --acc3:#D0C3A6; /* sand */
  --acc4:#9AA7BC; /* slate blue */
}

/* blaga dekor pozadina sekcije */
#services{
  position: relative;
  isolation: isolate;
}
#services::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(60rem 30rem at -10% -10%, rgba(200,162,122,.12), transparent 60%),
    radial-gradient(50rem 25rem at 110% 10%, rgba(154,167,188,.10), transparent 60%);
  z-index:-1;
}

/* tiles */
.service-tile{transition:transform .25s ease, box-shadow .25s ease}
.service-tile:hover{transform:translateY(-4px); box-shadow:0 .5rem 1.25rem rgba(0,0,0,.08)}
.icon-badge{
  width:42px;height:42px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:1.15rem;color:#fff;flex:0 0 42px;
  box-shadow:0 6px 14px rgba(0,0,0,.12) inset, 0 0 0 1px rgba(255,255,255,.25) inset;
}
.service-tile.accent-1 .icon-badge{background:linear-gradient(135deg,var(--acc1), #b98863)}
.service-tile.accent-2 .icon-badge{background:linear-gradient(135deg,var(--acc2), #6f8e85)}
.service-tile.accent-3 .icon-badge{background:linear-gradient(135deg,var(--acc3), #bdae8b)}
.service-tile.accent-4 .icon-badge{background:linear-gradient(135deg,var(--acc4), #7d8fa8)}

/* grupe – naslov s ikonicom + underline akcent */
.heading-ico{position:relative;padding-left:.05rem}
.heading-ico i{margin-right:.4rem;opacity:.9}
.heading-ico::after{
  content:"";display:block;margin-top:.35rem;width:54px;height:3px;
  background:linear-gradient(90deg, var(--acc1), transparent);
  border-radius:2px;opacity:.65;
}

/* kartice grupa */
.service-group.card{border-radius:1rem;border:1px solid rgba(0,0,0,.06);box-shadow:0 1px 2px rgba(0,0,0,.04)}
.service-group .card-body{padding:1rem 1.25rem}
.service-group ul{margin:0;padding-left:0;list-style:none}
.service-group ul li{position:relative;padding-left:1.15rem;margin-bottom:.35rem}
.service-group ul li::before{content:"✓";position:absolute;left:0;top:0;line-height:1;opacity:.85}

/* pricing callout */
.pricing-card{border-radius:1rem;background:rgba(0,0,0,.02);border:1px dashed rgba(0,0,0,.08)}
.pricing-card .card-body{padding:1rem 1.25rem;border-left:4px solid var(--acc2)}
