/**
 * File: /assets/css/usluge.css
 * Version: 1.10
 * Changes:
 * - Naše usluge: uklonjen flex razmak koji je gurao tipku na dno i stvarao veliki prazan bijeli dio
 * - kartice se više ne rastežu na visinu najviše kartice u redu
 * - bijeli sadržaj kartice je kompaktniji, a tipka ostaje odmah ispod opisa
 * - Poziv na akciju: dodan zaseban pomični wrapper za CTA tipku
 * - Poziv na akciju: dodana prozirna varijanta tipke s plavim obrubom i bez sjene
 * - ARTIFAX i MNA Cloud kartice prikazuju se u dvije kolone na desktopu
 * - unutar svake kartice tekst/ikone i slika ostaju zasebni blokovi
 * - Poslovna rješenja redizajnirana u dvije velike premium kartice za ARTIFAX i MNA Cloud
 * - veći vizuali, jasniji kontrast, badge oznake i tri kratke značajke po rješenju
 * - responzivni raspored 2 stupca / 1 stupac uz postojeće CMS dimenzije i pomake
 * - dodane lokalne veličine ikona/slika preko --services-icon-size
 * - dodane lokalne širine/visine za Hero prednosti, usluge, poslovna rješenja i Zašto Algor kartice
 * - fallback ikona ostaje u krugu, zamjenska slika ostaje bez pozadinskog bloka
 * - mobilni raspored poništava ručne pomake bloka kako bi ostao responzivan
 */
.services-v1{--srv-dark:#061523;--srv-dark-2:#0a1b2c;--srv-blue:#1188f8;--srv-blue-2:#42a9ff;--srv-text:#071629;--srv-muted:#5d6c7d;--srv-line:#dce5ee;--srv-soft:#f7f9fc;overflow:hidden;background:#fff;color:var(--srv-text)}
.services-v1 *{box-sizing:border-box}.services-v1 img{max-width:100%}.services-v1 a{text-decoration:none}.services-v1 h1,.services-v1 h2,.services-v1 h3,.services-v1 p{margin-top:0}.services-kicker{margin:0 0 10px;color:#138cf7;font-size:12px;font-weight:900;letter-spacing:.17em;text-transform:uppercase}
.services-hero{position:relative;min-height:475px;background:var(--srv-dark);color:#fff;overflow:hidden}.services-hero-media{position:absolute;inset:0 0 0 42%;overflow:hidden}.services-hero-media img{display:block;width:100%;height:100%;object-fit:cover}.services-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#061523 0%,rgba(6,21,35,.98) 37%,rgba(6,21,35,.67) 56%,rgba(6,21,35,.08) 82%),linear-gradient(0deg,rgba(6,21,35,.92) 0%,transparent 30%)}.services-hero-inner{position:relative;z-index:2;min-height:475px;padding-top:58px;padding-bottom:34px}.services-hero-copy{max-width:620px}.services-hero h1{max-width:650px;margin:0 0 20px;color:#fff;font-size:clamp(38px,4.7vw,68px);font-weight:900;line-height:1.02;letter-spacing:-.035em}.services-hero h1 em,.services-hero h1 strong{color:var(--srv-blue-2)}.services-hero-lead{max-width:560px;color:#d5e0ea;font-size:15px;line-height:1.7}.services-hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:27px}.services-btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:48px;padding:0 24px;border:1px solid transparent;border-radius:5px;font-size:13px;font-weight:800;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.services-btn:hover{transform:translateY(-1px)}.services-btn-primary{background:linear-gradient(135deg,#0e8fff,#1677ed);color:#fff;box-shadow:0 12px 32px rgba(19,136,247,.24)}.services-btn-secondary{border-color:#1a9bff;background:rgba(5,17,28,.56);color:#fff}.services-hero-facts{position:absolute;right:0;bottom:28px;display:grid;grid-template-columns:repeat(4,minmax(125px,1fr));gap:22px;width:min(720px,58%)}.services-hero-fact{display:flex;align-items:center;gap:10px;min-width:0}.services-fact-icon{display:grid;place-items:center;width:38px;height:38px;min-width:38px;border:1px solid rgba(93,179,255,.35);border-radius:50%;background:linear-gradient(145deg,rgba(22,139,251,.48),rgba(6,43,76,.88));color:#6fc0ff;box-shadow:0 7px 20px rgba(0,0,0,.22)}.services-fact-icon svg{width:20px;height:20px}.services-fact-image{display:grid;place-items:center;width:38px;height:38px;min-width:38px;overflow:visible}.services-fact-image img{display:block;width:100%;height:100%;max-width:none;object-fit:contain}.services-hero-fact strong{color:#f4f8fc;font-size:11px;font-weight:700;line-height:1.35}
.services-grid-section{padding:54px 0 62px;background:linear-gradient(180deg,#fbfcfe,#f5f8fb)}.services-section-head,.services-solutions-head{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:end;margin-bottom:30px}.services-section-head h2,.services-why h2{margin:0;font-size:clamp(32px,3vw,44px);font-weight:900;line-height:1.05;letter-spacing:-.025em}.services-section-intro{max-width:510px;justify-self:end;color:#5d6c7d;font-size:14px;line-height:1.65}.services-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:start}.services-card{position:relative;min-width:0;overflow:hidden;border:1px solid #dce5ee;border-radius:14px;background:#fff;box-shadow:0 10px 30px rgba(22,50,77,.06);transition:transform .18s ease,box-shadow .18s ease}.services-card:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(22,50,77,.10)}.services-card-media{aspect-ratio:10/3;height:auto;overflow:hidden;background:#071523}.services-card-media img{display:block;width:100%;height:100%;object-fit:contain;background:#071523}.services-card-icon{position:relative;z-index:2;display:grid;place-items:center;width:52px;height:52px;margin:-26px 0 -18px 18px;border:5px solid #fff;border-radius:50%;background:#168cf7;color:#fff;box-shadow:0 8px 22px rgba(12,117,220,.18)}.services-card-icon svg{width:23px;height:23px}.services-card-icon-image{position:relative;z-index:2;display:grid;place-items:center;width:52px;height:52px;margin:-26px 0 -18px 18px;overflow:visible}.services-card-icon-image img{display:block;width:100%;height:100%;max-width:none;object-fit:contain}.services-card-copy{display:flex;flex-direction:column;min-height:0;padding:34px 18px 18px}.services-card h3{margin:0 0 9px;font-size:16px;font-weight:900;line-height:1.22}.services-card-text{flex:0 0 auto;color:#596a7d;font-size:12px;line-height:1.55}.services-card-copy>a{display:inline-flex;align-items:center;gap:9px;margin-top:14px;color:#0986f6;font-size:12px;font-weight:800}.services-card-copy>a span{font-size:15px}
.services-solutions{padding:48px 0 55px;background:radial-gradient(circle at 82% 35%,rgba(28,74,110,.35),transparent 31%),linear-gradient(120deg,#061523,#0a1b2c);color:#fff}.services-solutions .services-kicker{color:#32a7ff}.services-solutions-head{align-items:start;margin-bottom:26px}.services-solutions-head h2{max-width:610px;margin:0;color:#fff;font-size:clamp(31px,3.2vw,46px);font-weight:900;line-height:1.05;letter-spacing:-.025em}.services-solutions-intro{max-width:500px;justify-self:end;color:#b9c7d4;font-size:13px;line-height:1.65}.services-solutions-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.services-solution-card{position:relative;min-height:178px;overflow:hidden;border:1px solid rgba(130,174,209,.25);border-radius:12px;background:#071523;box-shadow:0 16px 38px rgba(0,0,0,.15)}.services-solution-bg{position:absolute;inset:0 0 0 46%;width:54%;height:100%;object-fit:cover;opacity:.9}.services-solution-overlay{position:absolute;inset:0;background:linear-gradient(90deg,#071523 0%,rgba(7,21,35,.96) 42%,rgba(7,21,35,.72) 64%,rgba(7,21,35,.24) 100%)}.services-solution-copy{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;width:70%;min-height:178px;padding:24px 18px}.services-solution-copy h3{margin:0 0 10px;color:#fff;font-size:20px;font-weight:900}.services-solution-copy>div{color:#d1dbe5;font-size:11px;line-height:1.5}.services-solution-copy>a{display:inline-flex;align-items:center;gap:10px;margin-top:15px;color:#36adff;font-size:11px;font-weight:800}
.services-why{padding:44px 0 46px;background:#fff}.services-why h2{margin-bottom:28px}.services-why-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}.services-why-item{display:flex;align-items:flex-start;gap:16px;padding:4px 26px;border-right:1px solid #dbe5ee}.services-why-item:first-child{padding-left:0}.services-why-item:last-child{border-right:0;padding-right:0}.services-why-icon{display:grid;place-items:center;width:54px;height:54px;min-width:54px;border-radius:50%;background:#e8f4ff;color:#1188f8}.services-why-icon svg{width:27px;height:27px}.services-why-image{display:grid;place-items:center;width:54px;height:54px;min-width:54px;overflow:visible}.services-why-image img{display:block;width:100%;height:100%;max-width:none;object-fit:contain}.services-why-item strong{display:block;margin-bottom:5px;color:#101d2c;font-size:13px;line-height:1.3}.services-why-item div div{color:#667587;font-size:11px;line-height:1.45}
.services-cta-section{padding:0 0 42px;background:#fff}.services-cta{position:relative;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;min-height:150px;overflow:hidden;padding:28px 36px;border-radius:16px;background:#071523;color:#fff;box-shadow:0 12px 30px rgba(5,30,52,.12)}.services-cta-media{position:absolute;inset:0 0 0 52%;width:48%;height:100%;object-fit:cover;opacity:.95}.services-cta-shade{position:absolute;inset:0;background:linear-gradient(90deg,#071523 0%,rgba(7,21,35,.98) 48%,rgba(7,21,35,.52) 75%,rgba(7,21,35,.13) 100%)}.services-cta-copy,.services-cta-button-wrap{position:relative;z-index:2}.services-cta-copy{max-width:560px}.services-cta h2{margin:0 0 8px;color:#fff;font-size:31px;font-weight:900}.services-cta-copy>div{color:#d1dce6;font-size:13px;line-height:1.55}.services-cta-button-wrap{min-width:190px;margin-right:210px}.services-cta-button-wrap .services-btn{min-width:190px}.services-cta-button-wrap .services-btn.is-transparent{border-color:#1a9bff;background:transparent;color:#fff;box-shadow:none}.services-cta-button-wrap .services-btn.is-transparent:hover{background:rgba(17,136,248,.10);box-shadow:none}
@media(max-width:1180px){.services-hero-media{left:38%}.services-hero-facts{width:62%;gap:14px}.services-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.services-solutions-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.services-cta-button-wrap{margin-right:120px}}
@media(max-width:900px){.services-hero{min-height:auto}.services-hero-media{left:0;opacity:.34}.services-hero-shade{background:linear-gradient(90deg,rgba(6,21,35,.98),rgba(6,21,35,.82))}.services-hero-inner{min-height:auto;padding-top:46px;padding-bottom:38px}.services-hero-copy{max-width:680px}.services-hero-facts{position:relative;right:auto;bottom:auto;width:100%;grid-template-columns:repeat(2,1fr);margin-top:38px}.services-section-head,.services-solutions-head{grid-template-columns:1fr;gap:14px}.services-section-intro,.services-solutions-intro{justify-self:start}.services-solutions-grid{grid-template-columns:repeat(2,1fr)}.services-why-grid{grid-template-columns:repeat(2,1fr);gap:24px}.services-why-item{padding:0;border:0}.services-cta{grid-template-columns:1fr;padding-right:32px}.services-cta-media{left:45%;width:55%;opacity:.56}.services-cta-button-wrap{justify-self:start;margin-right:0}}
@media(max-width:620px){.services-hero-inner{padding-top:36px}.services-hero h1{font-size:38px}.services-hero-actions{display:grid}.services-btn{width:100%}.services-hero-facts{grid-template-columns:1fr;gap:14px}.services-grid-section{padding:42px 0 48px}.services-card-grid,.services-solutions-grid,.services-why-grid{grid-template-columns:1fr}.services-section-head h2,.services-why h2{font-size:32px}.services-card-copy{min-height:0}.services-solutions{padding:42px 0}.services-solution-card{min-height:170px}.services-solution-copy{width:78%}.services-why{padding:38px 0}.services-cta{min-height:190px;padding:28px 22px}.services-cta-media{left:34%;width:66%}.services-cta-shade{background:linear-gradient(90deg,#071523 0%,rgba(7,21,35,.92) 64%,rgba(7,21,35,.46) 100%)}.services-cta h2{font-size:28px}}


/* =============================================================
   1.06 — CMS mogućnosti prema O nama referenci
   ============================================================= */
.services-hero-fact{
    width:min(100%,var(--services-card-width,160px));
    min-height:var(--services-card-height,38px);
}
.services-fact-icon,
.services-fact-image{
    width:var(--services-icon-size,38px);
    height:var(--services-icon-size,38px);
    min-width:var(--services-icon-size,38px);
}
.services-fact-icon svg{width:52%;height:52%;}

.services-card{
    width:min(100%,var(--services-card-width,316px));
    min-height:var(--services-card-height,250px);
    justify-self:center;
}
.services-card-icon,
.services-card-icon-image{
    width:var(--services-icon-size,52px);
    height:var(--services-icon-size,52px);
    min-width:var(--services-icon-size,52px);
    margin-top:calc(var(--services-icon-size,52px) / -2);
    margin-bottom:calc(var(--services-icon-size,52px) / -2 + 8px);
}
.services-card-icon svg{width:44%;height:44%;}

.services-solution-card{
    width:min(100%,var(--services-card-width,316px));
    min-height:var(--services-card-height,178px);
    justify-self:center;
}
.services-solution-copy{min-height:var(--services-card-height,178px);}

.services-why-item{
    width:min(100%,var(--services-card-width,300px));
    min-height:var(--services-card-height,62px);
}
.services-why-icon,
.services-why-image{
    width:var(--services-icon-size,54px);
    height:var(--services-icon-size,54px);
    min-width:var(--services-icon-size,54px);
}
.services-why-icon svg{width:50%;height:50%;}

/* Zamjenska slika nema kružni/obojeni blok; samo fallback ikona ostaje u krugu. */
.services-fact-image,
.services-card-icon-image,
.services-why-image{
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
}
.services-fact-image img,
.services-card-icon-image img,
.services-why-image img{
    display:block;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:contain;
    overflow:visible;
}

@media(max-width:900px){
    .services-hero-fact,
    .services-card,
    .services-solution-card,
    .services-why-item{
        transform:none!important;
        max-width:100%;
    }
}
@media(max-width:620px){
    .services-card,
    .services-solution-card,
    .services-why-item,
    .services-hero-fact{
        width:100%;
        min-height:0;
    }
    .services-solution-copy{min-height:170px;}
}

/* =============================================================
   1.08 — Poslovna rješenja: jedan vanjski blok + odvojeni
          TEXT/IKONE i SLIKA blok za ARTIFAX i MNA Cloud
   ============================================================= */
.services-solutions{
    position:relative;
    padding:58px 0 68px;
    background:
        radial-gradient(circle at 88% 18%,rgba(17,136,248,.16),transparent 34%),
        radial-gradient(circle at 7% 88%,rgba(35,91,139,.14),transparent 29%),
        linear-gradient(135deg,#051522 0%,#081b2d 55%,#061625 100%);
    color:#fff;
}
.services-solutions::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.20;
    background-image:
        linear-gradient(rgba(90,170,235,.08) 1px,transparent 1px),
        linear-gradient(90deg,rgba(90,170,235,.08) 1px,transparent 1px);
    background-size:64px 64px;
    mask-image:linear-gradient(to bottom,transparent,black 18%,black 82%,transparent);
}
.services-solutions>.container{position:relative;z-index:1}
.services-owned-head{margin-bottom:34px}
.services-owned-head h2{max-width:690px}
.services-owned-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:22px;
    align-items:stretch;
}

/* Cijeli ARTIFAX / MNA blok. */
.services-owned-card{
    position:relative;
    display:flex;
    align-items:stretch;
    width:min(100%,var(--services-card-width,1500px));
    min-height:var(--services-card-height,330px);
    justify-self:center;
    overflow:hidden;
    border:1px solid rgba(89,171,232,.31);
    border-radius:18px;
    background:#071827;
    box-shadow:0 22px 52px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.025);
    transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.services-owned-card:hover{
    transform:translateY(-2px);
    border-color:rgba(68,174,255,.52);
    box-shadow:0 28px 64px rgba(0,0,0,.27),0 0 0 1px rgba(47,160,244,.06);
}

/* LIJEVI unutarnji blok: sav tekst + check ikone + tipka. */
.services-owned-content{
    position:relative;
    z-index:2;
    display:flex;
    flex:1 1 54%;
    flex-direction:column;
    justify-content:center;
    width:min(100%,var(--services-card-width,760px));
    min-height:var(--services-card-height,300px);
    padding:30px 42px;
    background:
        radial-gradient(circle at 12% 12%,rgba(22,142,238,.09),transparent 42%),
        linear-gradient(135deg,#081a2a 0%,#071725 100%);
}
.services-owned-content::after{
    content:"";
    position:absolute;
    top:24px;
    right:0;
    bottom:24px;
    width:1px;
    background:linear-gradient(to bottom,transparent,rgba(77,169,235,.28),transparent);
}
.services-owned-badge{
    align-self:flex-start;
    margin:0 0 12px;
    padding:5px 9px;
    border:1px solid rgba(56,169,255,.34);
    border-radius:5px;
    background:rgba(16,132,224,.10);
    color:#52b7ff;
    font-size:9px;
    font-weight:900;
    letter-spacing:.13em;
    text-transform:uppercase;
}
.services-owned-content h3{
    margin:0 0 10px;
    color:#fff;
    font-size:clamp(27px,2.1vw,36px);
    font-weight:900;
    line-height:1.04;
    letter-spacing:-.025em;
}
.services-owned-text{
    max-width:620px;
    color:#d3deea;
    font-size:13px;
    line-height:1.6;
}
.services-owned-points{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px 16px;
    margin:20px 0 0;
    padding:0;
    list-style:none;
}
.services-owned-points li{
    display:flex;
    align-items:flex-start;
    min-width:0;
    gap:9px;
    color:#c3d1df;
    font-size:11px;
    line-height:1.38;
}
.services-owned-points li>span{
    display:grid;
    place-items:center;
    width:18px;
    height:18px;
    min-width:18px;
    margin-top:-1px;
    border:1px solid rgba(69,188,255,.58);
    border-radius:50%;
    background:rgba(17,136,248,.13);
    color:#59c5ff;
    font-size:9px;
    font-weight:900;
}
.services-owned-points li>div{min-width:0}
.services-owned-link{
    display:inline-flex;
    align-items:center;
    gap:10px;
    align-self:flex-start;
    margin-top:22px;
    color:#45b6ff;
    font-size:11px;
    font-weight:900;
}
.services-owned-link span{font-size:15px;transition:transform .18s ease}
.services-owned-link:hover span{transform:translateX(3px)}

/* DESNI unutarnji blok: samo slika. Nema teksta preko slike. */
.services-owned-media{
    position:relative;
    z-index:1;
    display:block;
    flex:0 1 46%;
    width:min(100%,var(--services-card-width,620px));
    min-height:var(--services-card-height,300px);
    overflow:hidden;
    background:
        radial-gradient(circle at 50% 45%,rgba(28,145,235,.14),transparent 48%),
        #06131f;
}
.services-owned-media::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    box-shadow:inset 0 0 52px rgba(2,13,23,.34);
}
.services-owned-media img{
    display:block;
    width:100%;
    height:100%;
    min-height:inherit;
    object-fit:cover;
}

@media(max-width:1180px){
    .services-owned-points{grid-template-columns:1fr 1fr}
    .services-owned-content{padding:28px 32px}
}
@media(max-width:900px){
    .services-owned-card{
        transform:none!important;
        max-width:100%;
        flex-direction:column-reverse;
    }
    .services-owned-content,
    .services-owned-media{
        transform:none!important;
        width:100%!important;
        max-width:100%;
        min-height:0;
        flex:none;
    }
    .services-owned-content{padding:28px 26px 30px}
    .services-owned-content::after{display:none}
    .services-owned-media{height:260px}
    .services-owned-media img{height:260px;min-height:260px}
}
@media(max-width:620px){
    .services-solutions{padding:44px 0 50px}
    .services-owned-grid{gap:18px}
    .services-owned-card{width:100%;min-height:0}
    .services-owned-content{padding:24px 20px 26px}
    .services-owned-content h3{font-size:28px}
    .services-owned-text{font-size:12px}
    .services-owned-points{grid-template-columns:1fr;gap:8px}
    .services-owned-media{height:220px}
    .services-owned-media img{height:220px;min-height:220px}
}


/* =============================================================
   1.09 — ARTIFAX + MNA CLOUD: JEDAN PORED DRUGOGA
   Svako rješenje ostaje jedan vanjski blok; unutar njega su
   odvojeni blok teksta/ikona i blok slike.
   ============================================================= */
@media (min-width:1051px){
    .services-owned-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:24px!important;
        align-items:stretch!important;
    }
    .services-owned-card{
        display:grid!important;
        grid-template-columns:minmax(0,1.12fr) minmax(250px,.88fr)!important;
        align-items:stretch!important;
        width:min(100%,var(--services-card-width,760px))!important;
        min-height:var(--services-card-height,390px)!important;
        justify-self:stretch!important;
    }
    .services-owned-content{
        display:flex!important;
        flex:none!important;
        flex-direction:column!important;
        justify-content:center!important;
        align-self:stretch!important;
        justify-self:start!important;
        width:min(100%,var(--services-card-width,410px))!important;
        min-height:var(--services-card-height,360px)!important;
        padding:28px 28px!important;
    }
    .services-owned-media{
        display:block!important;
        flex:none!important;
        align-self:stretch!important;
        justify-self:end!important;
        width:min(100%,var(--services-card-width,330px))!important;
        min-height:var(--services-card-height,360px)!important;
    }
    .services-owned-points{
        grid-template-columns:1fr!important;
        gap:9px!important;
    }
}

@media (min-width:761px) and (max-width:1050px){
    .services-owned-grid{grid-template-columns:1fr!important;}
    .services-owned-card{
        width:min(100%,900px)!important;
        margin-inline:auto;
    }
}