
.about-hero{padding:120px 0 130px;background:#fff}.about-hero-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.55fr);gap:80px;align-items:end}.about-kicker{display:block;margin-bottom:22px;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#64748b}.about-hero h1{margin:0;max-width:1100px;font-size:clamp(70px,8vw,145px);line-height:.88;letter-spacing:-.065em;font-weight:500;color:#111}.about-hero-copy p{margin:0 0 12px;font-size:21px;line-height:1.6;color:#5d6879}
.about-what,.about-software,.about-design,.about-clients,.about-tech{padding:130px 0}.about-what{background:#f6f9fc}.about-section-head{margin-bottom:65px}.about-section-head.split{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:70px;align-items:end}.about-section-head h2{margin:0;max-width:980px;font-size:clamp(58px,6.5vw,112px);line-height:.92;letter-spacing:-.055em;font-weight:500;color:#111}.about-section-head>p,.about-section-head.split>p{margin:0;max-width:500px;font-size:18px;line-height:1.6;color:#64748b}
.about-capabilities{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #dce4ec;border-left:1px solid #dce4ec}.about-capabilities article{min-height:260px;padding:34px;border-right:1px solid #dce4ec;border-bottom:1px solid #dce4ec;display:flex;flex-direction:column;justify-content:space-between}.about-capabilities article>span{font-size:12px;color:#94a3b8;font-weight:800}.about-capabilities h3{margin:55px 0 10px;font-size:42px;letter-spacing:-.045em}.about-capabilities p{margin:0;color:#667085;line-height:1.55}
.about-numbers{padding:120px 0;background:#0f172a;color:#fff}.about-numbers-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.about-number{aspect-ratio:1;border:1px solid rgba(255,255,255,.22);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.about-number strong{font-size:clamp(70px,7vw,128px);line-height:.88;letter-spacing:-.065em}.about-number span{margin-top:16px;color:rgba(255,255,255,.68);font-size:15px;text-transform:uppercase;letter-spacing:.07em}
.about-software{background:#fff}.about-project-showcase{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.about-project-card.wide{grid-column:1/-1}
.about-project-visual{min-height:330px;padding:34px;display:flex;align-items:flex-end;background:linear-gradient(135deg,#dff1ff,#bcdfff);overflow:hidden}
.about-project-card.wide .about-project-visual{min-height:500px}.about-project-visual.imagebrand{background:radial-gradient(circle at 75% 30%,rgba(29,161,255,.58),transparent 30%),linear-gradient(135deg,#10243d,#07111f)}.about-project-visual span{font-size:clamp(34px,4vw,72px);font-weight:700;letter-spacing:-.045em;color:#0f172a}.about-project-visual.imagebrand span{color:#fff}.about-project-info{padding:24px 0 28px}.about-project-info h3{margin:0 0 12px;font-size:34px;letter-spacing:-.04em}.about-project-info p{margin:0;max-width:780px;color:#667085;line-height:1.6;font-size:16px}
.about-design{background:#f3f7fb}.about-design-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:18px}.design-tile{display:flex;align-items:flex-end;padding:24px;background:#fff;border:1px solid #e1e8ef;font-size:28px;font-weight:800;letter-spacing:-.04em}.design-tile.tall{grid-row:span 2;background:#1DA1FF;color:#fff}.design-tile.wide{grid-column:span 2;background:#0f172a;color:#fff}
.about-clients{background:#fff}.about-client-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #e2e8f0;border-left:1px solid #e2e8f0}.about-client-item{min-height:145px;display:grid;place-items:center;padding:26px;border-right:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0}.about-client-item img{max-width:155px;max-height:60px;object-fit:contain;filter:grayscale(1);opacity:.7;transition:.25s}.about-client-item:hover img{filter:none;opacity:1}
.about-tech{background:#07111f;color:#fff}.about-tech .about-kicker,.about-tech h2{color:#fff}.about-tech-list{display:flex;flex-wrap:wrap;gap:14px}.about-tech-list span{padding:14px 22px;border:1px solid rgba(255,255,255,.18);border-radius:999px;font-size:18px;color:rgba(255,255,255,.86)}
@media(max-width:991px){.about-hero-grid,.about-section-head.split{grid-template-columns:1fr;gap:34px}.about-capabilities{grid-template-columns:1fr 1fr}.about-numbers-grid{gap:12px}.about-project-showcase{grid-template-columns:1fr}.about-project-card.wide{grid-column:auto}.about-project-card.wide .about-project-visual{min-height:380px}.about-design-grid{grid-template-columns:1fr 1fr}.about-client-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:767px){.about-hero{padding:82px 0 90px}.about-hero h1{font-size:clamp(58px,15vw,84px)}.about-hero-copy p{font-size:17px}.about-what,.about-software,.about-design,.about-clients,.about-tech{padding:82px 0}.about-section-head{margin-bottom:44px}.about-section-head h2{font-size:clamp(48px,13vw,68px)}.about-capabilities{grid-template-columns:1fr}.about-capabilities article{min-height:210px}.about-numbers{padding:82px 0}.about-numbers-grid{grid-template-columns:1fr;max-width:380px;margin:0 auto}.about-project-visual,.about-project-card.wide .about-project-visual{min-height:300px}.about-design-grid{grid-template-columns:1fr;grid-auto-rows:190px}.design-tile.tall,.design-tile.wide{grid-row:auto;grid-column:auto}.about-client-grid{grid-template-columns:1fr 1fr}.about-client-item{min-height:110px}.about-client-item img{max-width:120px}}

.about-hero-media{padding:0 0 110px;background:#fff}
.about-hero-media-inner{position:relative;overflow:hidden}
.about-hero-media img{display:block;width:100%;height:min(58vw,720px);object-fit:cover}
.about-hero-tags{position:absolute;left:28px;bottom:28px;display:flex;gap:10px;flex-wrap:wrap}
.about-hero-tags span{padding:10px 14px;border-radius:999px;background:rgba(7,17,31,.82);backdrop-filter:blur(8px);color:#fff;font-size:12px;font-weight:800;letter-spacing:.08em}
@media(max-width:767px){
 .about-hero-media{padding-bottom:72px}
 .about-hero-media img{height:58vw;min-height:260px}
 .about-hero-tags{left:16px;bottom:16px}
}


/* =========================================================
   ABOUT HERO IMAGE FIX v1
   - cela hero grafika ostaje vidljiva
   - nema dodatnih bedževa preko slike
   ========================================================= */

.about-hero-media-inner {
    overflow: hidden;
}

.about-hero-media img {
    display: block;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
}

/* WEB / SOFTWARE / DESIGN već postoje unutar same grafike */
.about-hero-tags {
    display: none !important;
}

@media (max-width: 767px) {
    .about-hero-media {
        padding-bottom: 64px;
    }

    .about-hero-media img {
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        object-fit: contain !important;
        object-position: center center !important;
    }
}
.about-project-visual {
    position: relative;
    overflow: hidden;
}

.about-project-visual > span {
    position: relative;
    z-index: 2;

    color: #fff !important;
    font-weight: 400 !important;
    font-size: clamp(34px, 3.8vw, 48px) !important;
    line-height: .02 !important;
    letter-spacing: 0.05em !important;

    text-shadow:
        0 2px 3px rgba(0, 0, 0, .85),
        0 6px 18px rgba(0, 0, 0, .65);
}

.about-project-visual::after {
    content: "";
    position: absolute;
    inset: 45% 0 0 0;
    z-index: 1;
    pointer-events: none;

    background: linear-gradient(
        to bottom,
        rgba(0,0,0,0),
        rgba(0,0,0,.18) 50%,
        rgba(0,0,0,.42) 100%
    );
}

@media (max-width: 767px) {
    .about-project-visual > span {
        font-size: clamp(30px, 9vw, 46px) !important;
        line-height: 1 !important;
    }
}