/* ==============================================
   ROOT VARIABLES - Generalno
   ============================================== */

:root {
    --primary-color: #5f9144;
    --secondary-color: #388E3C;
    --background-color: #FFFFFF;
    --text-dark: #333333;
    --text-light: #FFFFFF;
    --separator-color: #C8E6C9;
    --font-family: Arial, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    background-color: var(--background-color);
    color: var(--text-dark);
    font-family: var(--font-family);
    line-height: 1.6;
    padding-top: 70px;
}

a { text-decoration: none; color: inherit; }
ul { list-style: none; }
.section-container { padding: 40px 5%; max-width: 1200px; margin: 0 auto; }

/* ==============================================
   Header.html - Stranica
   ============================================== */

#top-message-bar {
    background-color: #5f9144;
    color: var(--text-light);
    padding: 6px 0;
    text-align: center;
}

#main-header {
    background-color: var(--primary-color);
    color: var(--text-light);
    padding: 12px 5%;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 1000;
    transition: transform 0.3s ease-in-out;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.header-content {
    max-width: 1400px; /* Malo šire od standarda, ali i dalje drži fokus */
    margin: 0 auto;    /* Centriranje */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;   /* Bezbedna zona da se ne zalepi za ivice na manjim ekranima */
}

.logo-text { font-size: 1.8em; font-weight: bold; color: white; }

/* Logo na levoj strani */
.logo-container {
    display: flex;
    align-items: center;
}

/* Menu NA DESNOJ STRANI */
.main-nav {
    margin-left: auto; /* Gura sve desno */
    display: flex;
    align-items: center;
}

.main-nav ul {
    display: flex;
    gap: 15px;
    align-items: center;
    margin: 0;
    padding: 0;
}

/* IZMENJENO: Glavni linkovi su sada zaobljeni (pill shape) */
.main-nav a {
    padding: 8px 18px;
    border-radius: 50px; /* Potpuno zaobljene ivice */
    color: white;
    text-decoration: none;
    transition: all 0.3s ease; /* Tečan prelaz boje na hover */
}

/* NOVO: Blaga sivkasta pozadina kada se pređe mišem preko menija */
.main-nav a:hover {
    background-color: rgba(255, 255, 255, 0.15); /* Prozračna siva koja ne guši logo */
}

/* Search na desnoj strani sa menuem */
.search-icon {
    display: flex;
    align-items: center;
    margin-left: 15px;
}

.search-icon a {
    color: white;
    transition: color 0.2s;
    font-size: 1.3em;
    padding: 8px; /* Dodat padding da krug oko ikonice bude simetričan */
    border-radius: 50%; /* Okrugli hover oko ikonice pretrage */
}

.search-icon a:hover {
    color: var(--secondary-color);
    background-color: rgba(255, 255, 255, 0.1); /* I ikonica dobija blagi krug */
}

.search-icon {
    position: relative;
}

.search-toggle {
    color: white;
    background: transparent;
    border: 0;
    cursor: pointer;
    transition: color 0.2s;
    font-size: 1.3em;
    padding: 8px;
    border-radius: 50%;
}

.search-toggle:hover {
    color: var(--secondary-color);
    background-color: rgba(255, 255, 255, 0.1);
}

.site-search-panel {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    z-index: 1100;
    width: min(360px, calc(100vw - 24px));
    padding: 12px;
    color: var(--text-dark);
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

.site-search-panel[hidden] {
    display: none;
}

.site-search-form {
    display: flex;
    gap: 8px;
}

.site-search-form input {
    flex: 1;
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid #cbd5e1;
    border-radius: 5px;
    font: inherit;
}

.site-search-form button {
    width: 40px;
    border: 0;
    border-radius: 5px;
    color: #fff;
    background: var(--secondary-color);
    cursor: pointer;
}

.site-search-status {
    padding: 8px 2px 2px;
    color: #64748b;
    font-size: 13px;
}

.site-search-retry {
    padding: 0;
    border: 0;
    color: var(--secondary-color);
    background: transparent;
    font: inherit;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}

.site-search-results {
    max-height: 320px;
    overflow-y: auto;
}

.site-search-panel .site-search-results a {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 9px 8px;
    color: var(--text-dark);
    font-size: 1rem;
    border-radius: 5px;
}

.site-search-panel .site-search-results a:hover,
.site-search-panel .site-search-results a:focus {
    background: #f1f5f9;
    outline: none;
}

.site-search-panel .site-search-results strong {
    color: #1f2937;
    font-size: 1rem;
    font-weight: 700;
}

.site-search-results span {
    color: #64748b;
    font-size: 12px;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media screen and (max-width: 768px) {
    .site-search-panel {
        position: fixed;
        top: 76px;
        right: 12px;
        width: calc(100% - 24px);
    }
}

.hamburger-btn {
    display: none;
    cursor: pointer;
    font-size: 1.5rem;
    color: #5f8d32;
}

/* Osnovno za desktop: hamburger je sakriven */
.hamburger-btn {
    display: none;
}

@media screen and (max-width: 768px) {
    body {
        padding-top: 100px !important;
    }

    #top-message-bar {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1001;
        font-size: 12px;
        padding: 4px 10px;
    }

    #main-header {
        padding: 6px 12px !important;
        top: 27px;
        left: 0;
        right: 0;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .header-content {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    .logo-text {
        font-size: 1.2em;
        order: 1;
    }

    /* Sakrivamo običan meni na mobilnom po defaultu */
    .main-nav ul {
        display: none;
        margin-top: 0 !important;
    }

    .main-nav {
        display: block !important;
        flex: 0 0 auto;
        width: 0;
    }

    /* Tvoj hamburger dugme zakucano u desni ćošak */
    .hamburger-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
        font-size: 1.5rem !important;
        color: #ffffff !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 0 0 10px !important;
        order: 3 !important;
    }

    .search-icon {
        display: flex !important;
        align-items: center !important;
        order: 2 !important;
        margin-left: auto !important;
    }
}

/* ==============================================
    Header.html - DROPDOWN (KLIK SISTEM)
   ============================================== */
.main-nav .dropdown { position: relative; }

.main-nav .dropdown .dropdown-menu {
    display: none;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 180px;
    background: var(--primary-color);
    box-shadow: 0 6px 16px rgba(0,0,0,0.12);
    border-radius: 8px; /* Malo više zaobljeno da prati stil */
    padding: 8px 0;
    transition: all .15s ease;
}

/* NOVO: Stavke unutar dropdown-a takođe dobijaju zaobljen hover */
.main-nav .dropdown .dropdown-menu li a {
    padding: 10px 16px;
    display: block;
    color: white;
    border-radius: 6px;
    margin: 0 8px; /* Razmak da siva pozadina ne udara u ivice menija */
}

.main-nav .dropdown .dropdown-menu li a:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.main-nav .dropdown.open .dropdown-menu {
    display: block;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* IZMENJENO: Kontakt dugme je sada isto zaobljeno (pill) */
.contact-btn {
    border: 2px solid white;
    border-radius: 50px !important; /* Forsiramo skroz zaobljeno */
    padding: 8px 20px !important;
    font-weight: 600;
}

/* NOVO: Efekat za kontakt dugme - punjenje belom bojom */
.contact-btn:hover {
    background-color: white !important;
    color: var(--primary-color) !important;
}

/* ==============================================
   index.html - Banner text
   ============================================== */
   .tekstiznadbannera-brand-header {
    text-align: center;
    margin-top: 2rem;    /* Razmak od elementa iznad */
}

.tekstiznadbannerar-brand-header h2 {
    font-size: 1.8rem;
    color: #444;         /* Tamnije siva, profesionalna boja */
    text-transform: uppercase;
    letter-spacing: 2px; /* Malo razmaka između slova za moderniji izgled */
    font-weight: 600;
}

.tekstiznadbannerar-header-line {
    width: 60px;
    height: 3px;
    background-color: #7ad6a0; /* Svetlo siva linija */
    margin: 10px auto 0;    /* Centrirana linija ispod teksta */
    border-radius: 2px;
}

   /* ==============================================
   index.html - Banner
   ============================================== */
.carousel-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 500px;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.carousel-track {
    display: flex;
    transition: transform 1s ease-in-out;
    height: 100%;
}


.carousel-slide {
    min-width: 100%;
    flex-shrink: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 1.5em;
    position: relative;
    /* Background-size contain ako je perfektna slika 16:9 1980x1080 ili najbolje cover da prosiri */
    /* Ako slike budu 1920x1080px, cijeli prostor će biti popunjen */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #f5f5f5; /* Siva boja popunjava prazne dijelove */
}

.carousel-slide::before { /* Zatamljenje preko bannera */
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.1); /* Zadnja brojka daje kolicinu svetlosti +/- */
    z-index: 1;
}

.carousel-slide h3,
.carousel-slide p {
    z-index: 2;
    margin: 0;
    padding: 0 10px;
    text-align: center;
}

.carousel-nav-dots {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
}

.dot {
    height: 12px;
    width: 12px;
    background-color: rgba(255,255,255,0.5);
    border-radius: 50%;
    cursor: pointer;
    transition: background-color 0.2s;
}

.dot.active {
    background-color: white;
}
/* ==============================================
   index.html - 3 info kartice
   ============================================== */
   /* Centrirana teksta iznad kartica */
   .poslovanje-brand-header {
    text-align: center;
    margin-top: 6rem;    /* Razmak od elementa iznad */
    margin-bottom: 2rem; /* Razmak do teksta */
}

.poslovanje-brand-header h2 {
    font-size: 1.8rem;
    color: #444;         /* Tamnije siva, profesionalna boja */
    text-transform: uppercase;
    letter-spacing: 2px; /* Malo razmaka između slova za moderniji izgled */
    font-weight: 600;
}

.poslovanje-header-line {
    width: 60px;
    height: 3px;
    background-color: #7ad6a0; /* Svetlo siva linija */
    margin: 10px auto 0;    /* Centrirana linija ispod teksta */
    border-radius: 2px;
}
/* 3 kartice */

.three-column-grid { 
    display: grid; 
    grid-template-columns: repeat(3,1fr); 
    gap: 30px; 
    margin-top: 30px;
}

.grid-card {
    padding: 10px;
    border: 1px solid #eee;
    border-radius: 8px;
    text-align: center;
    transition: transform .25s, box-shadow .25s;

}

.grid-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* ==============================================
   index.html - Banneri Firme
   ============================================== */
   /* Centrirana teksta iznad firme */
 .firme-brand-header {
    text-align: center;
        margin-top: 5rem;    /* Razmak od elementa iznad */
    margin-bottom: 2rem; /* Razmak do slajdera */
}

.firme-brand-header h2 {
    font-size: 1.8rem;
    color: #444;         /* Tamnije siva, profesionalna boja */
    text-transform: uppercase;
    letter-spacing: 2px; /* Malo razmaka između slova za moderniji izgled */
    font-weight: 600;
}

.firme-header-line {
    width: 60px;
    height: 3px;
    background-color: #7ad6a0; /* Svetlo siva linija */
    margin: 10px auto 0;    /* Centrirana linija ispod teksta */
    border-radius: 2px;
}

/* Firme */

.wrapper {
  width: 90%;
  max-width: 1200px;
  margin-inline: auto;
  position: relative;
  height: 100px;
  margin-top: 5rem;
  margin-bottom: 50px; /* DODAJ OVO: Razmak od footera */
  overflow: hidden; /* Da ne izlaze van ekrana */
  mask-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 0),
    rgba(0, 0, 0, 1) 20%,
    rgba(0, 0, 0, 1) 80%,
    rgba(0, 0, 0, 0)
  );
}

@keyframes scrollLeft {
  to {
    left: -200px;
  }
}

.item {
  width: 200px;
  height: 100px;
  position: absolute;
  left: max(calc(200px * 8), 100%); /* 8 je broj logoa, 200px širina */
  animation-name: scrollLeft;
  animation-duration: 30s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  display: flex;
  justify-content: center;
  align-items: center;
}

.item img {
  max-width: 150px;
  filter: grayscale(100%);
  opacity: 0.6;
  transition: 0.3s;
}

.item img:hover {
  filter: grayscale(0%);
  opacity: 1;
}

/* ZAKAŠNJENJE ZA SVAKI LOGO POSEBNO */
/* Formula: (Trajanje / Broj logoa) * (Redni broj - 1) */
/* 30s / 8 = 3.75s */

.item1 { animation-delay: calc(30s / 8 * (8 - 1) * -1); }
.item2 { animation-delay: calc(30s / 8 * (8 - 2) * -1); }
.item3 { animation-delay: calc(30s / 8 * (8 - 3) * -1); }
.item4 { animation-delay: calc(30s / 8 * (8 - 4) * -1); }
.item5 { animation-delay: calc(30s / 8 * (8 - 5) * -1); }
.item6 { animation-delay: calc(30s / 8 * (8 - 6) * -1); }
.item7 { animation-delay: calc(30s / 8 * (8 - 7) * -1); }
.item8 { animation-delay: calc(30s / 8 * (8 - 8) * -1); }


/* ==============================================
   FOOTER.html Stranica
   ============================================== */
footer {
    background: var(--primary-color);
    color: white;
    padding: 40px 5%;
}

.footer-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 40px;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--separator-color);
    text-align: center;
}

.footer-card {
    text-align: center;
}

.copyright {
    text-align: center;
    margin-top: 20px;
    font-size: 0.9em;
    color: #e0e0e0;
}

/* ==============================================
   Footer.html - RESPONSIVE
   ============================================== */
@media (max-width: 768px) {
    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-areas:
            "info uskoro"
            "radno-vreme radno-vreme";
        align-items: start;
    }

    .footer-card:nth-child(1) {
        grid-area: info;
    }

    .footer-card.center-card {
        grid-area: radno-vreme;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 4px 16px;
    }

    .footer-card.center-card h4 {
        grid-column: 1 / -1;
    }

    .footer-hours-location {
        min-width: 0;
    }

    .footer-firma {
        grid-column: 1;
    }

    .footer-magacin {
        grid-column: 2;
    }

    .footer-card:nth-child(3) {
        grid-area: uskoro;
    }

    .header-content {
        flex-direction: column;
        align-items: flex-start;
    }

    .main-nav ul {
        flex-direction: column;
        gap: 10px;
        margin-top: 10px;
    }

    .carousel-slide h3,
    .carousel-slide p {
        font-size: 1.2em;
    }

    .three-column-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 20px;
        text-align: center;
    }

    .banner-section {
        padding: 24px 5% 16px;
    }

    .carousel-wrapper {
        height: auto;
        aspect-ratio: 3 / 2;
    }

    .carousel-track,
    .carousel-slide {
        height: 100%;
    }

    .carousel-slide {
        background-size: contain;
    }

    .info-grid-section {
        padding-top: 20px;
    }

    .info-grid-section .poslovanje-brand-header {
        margin-top: 2rem;
        margin-bottom: 1.5rem;
    }

    .info-grid-section .poslovanje-brand-header h2 {
        font-size: clamp(1.35rem, 5.5vw, 1.7rem);
        letter-spacing: 1px;
    }

    .info-grid-section .three-column-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
        margin-top: 20px;
    }

    .info-grid-section .grid-card {
        padding: 20px;
        text-align: left;
    }

    .info-grid-section .grid-card .icon {
        display: block;
        margin-bottom: 10px;
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

    .info-grid-section .grid-card h3 {
        margin-bottom: 8px;
        font-size: 1.15rem;
    }

    .info-grid-section .grid-card p,
    .info-grid-section .grid-card li {
        font-size: 1rem;
        line-height: 1.55;
        overflow-wrap: normal;
        word-break: normal;
    }

    .info-grid-section .grid-card ul {
        padding-left: 20px;
        list-style: disc;
    }

    .info-grid-section .grid-card li + li {
        margin-top: 4px;
    }
}

@media (max-width: 480px) {
    .footer-grid {
        gap: 16px;
    }
}

/* ==============================================
   kontakt.html - Stranica
   ============================================== */

.kontaktrazmakime { /* Kontakt ime */
    margin-bottom: 15px;
}

.kontaktikonica { /* Kontakt ikonica (logo) */
    width: 50px;
    margin-bottom: 15px;
}

.kontaktuloga { /* Informacije o korisniku ispod Kontakt Imena */
    display: block;
    font-size: 13px;
    color: #7a7a7a;
    font-style: italic;
    margin-top: -20px;   /* približi imenu */
    margin-bottom: 10px;
}

.grid-separator-text {
    grid-column: 1 / -1;       /* zauzima sve kolone grida */
    display: flex;
    align-items: center;
    text-align: center;
    margin: 30px 0;            /* razmak iznad i ispod */
}

.grid-separator-text::before,
.grid-separator-text::after {
    content: "";
    flex: 1;                   /* linije zauzimaju sav raspoloživi prostor */
    border-bottom: 1px solid #ccc; 
}

.grid-separator-text::before {
    margin-right: 10px;
}

.grid-separator-text::after {
    margin-left: 10px;
}

.grid-separator-text span {
    font-size: 18px;
    color: #555;
    font-weight: 600;
    white-space: nowrap;        /* tekst ostaje u jednom redu */
}

.zadnjiredkontakt {
    display: flex;
    justify-content: center; /* centriranje kartica */
    gap: 30px; /* razmak između kartica */
}

.kontakt-grid .three-column-grid { 
    display: grid; 
    /* minmax(0, 1fr) dozvoljava gridu da se bolje prilagodi sadržaju */
    grid-template-columns: repeat(3, minmax(0, 1fr)); 
    gap: 15px; /* Smanjen sa 30px na 15px da bi kartice dobile više širine */
    margin-top: 30px; 
}

.kontakt-grid .grid-card {
    padding: 20px 15px 40px 15px; /* Redosled: Gore, Desno, Dole, Levo */
    border: 1px solid #eee;
    border-radius: 8px;
    text-align: center;
    transition: transform .25s, box-shadow .25s;
    
    /* Ovo sprečava da email ode u novi red */
    overflow: hidden; 
}

.kontakt-grid .grid-card p, .kontakt-grid .grid-card a, .kontakt-grid .grid-card div {
    white-space: normal;
    overflow-wrap: anywhere;
    font-size: 16px;
}

.kontakt-telefon-link {
    color: inherit;
    text-decoration: none;
}

@media (min-width: 769px) {
    .kontakt-telefon-link {
        pointer-events: none;
        cursor: text;
    }
}

@media (max-width: 768px) {
    .kontakt-telefon-link {
        color: #5f8d32;
        text-decoration: underline;
        text-underline-offset: 2px;
    }
}

.kontakt-grid .grid-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 8px #5f8d32;
}

@media (max-width: 768px) {
    .kontakt-grid .three-column-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .kontakt-grid .three-column-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ==============================================
   kontakt.html - Lokacije 
   ============================================== */
.kontakt-locations {
    max-width: 1200px;
    margin: 0 auto 60px;
    padding: 0 20px;
}

.kontakt-locations-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

/* Kartica lokacije */
.kontakt-location-card {
    background: #fff;
    border-radius: 14px;
    padding: 20px;
    box-shadow: 0 8px 20px #5f8d32;;
}

/* Naslov lokacije */
.kontakt-location-card h3 {
    margin-bottom: 6px;
    font-size: 20px;
}

/* Adresa / kontakt */
.kontakt-location-card p {
    margin-bottom: 15px;
    color: #555;
}

/* Dodatni kontakt podaci u lokacijama */
.kontakt-location-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 14px;
}

.kontakt-location-details-column p {
    margin-bottom: 6px;
}

.kontakt-location-details-column h3 {
    margin-top: 0;
}

/* Mapa */
.kontakt-location-card iframe {
    width: 100%;
    height: 280px;
    border: 0;
    border-radius: 10px;
}

/* 📱 Responsive */
@media (max-width: 900px) {
    .kontakt-locations-grid {
        grid-template-columns: 1fr;
    }

    .kontakt-location-details {
        gap: 14px;
    }

    .kontakt-location-card iframe {
        height: 260px;
    }
}

@media (max-width: 600px) {
    .kontakt-location-details {
        grid-template-columns: 1fr;
        gap: 8px;
    }
}

/* ==============================================
   kontakt.html - Kontakt forma - NOVO
   ============================================== */

/* ==============================================
   Onama.html Stranica
   ============================================== */

   /* --- Pocetna SEKCIJA --- */
.onama-hero-section {
    display: flex;
    min-height: 80vh;
    align-items: center;
    background: #fff;
}

.onama-hero-content {
    flex: 1;
    padding: 60px;
}

.onama-hero-content .onama-eyebrow {
    text-transform: uppercase;
    letter-spacing: 3px;
    font-size: 0.8rem;
    color: #5f8d32;
    display: block;
    margin-bottom: 15px;
}

.onama-hero-content h1 {
    font-size: clamp(2.5rem, 5vw, 4rem);
    line-height: 1.1;
    margin-bottom: 25px;
    color: #1a1a1a;
}

.onama-hero-visual {
    flex: 1;
    height: 30vh;
    background: url('../img/logo2.png') center/cover no-repeat;
    position: relative;
    background-size: auto 100%;

    /* Animacija */
    animation: slideRightToPosition 2s ease-out forwards;
}

/* Animacija: start sa leve strane, klizanje do trenutne pozicije */
@keyframes slideRightToPosition {
    from {
        background-position: left center; /* start sa leve strane */
    }
    to {
        background-position: center center; /* krajnja pozicija koju već imaš */
    }
}


/* --- STORY SEKCIJA - Sertifikat --- */
.onama-story-section {
    padding: 100px 0;
    background: #f9f9f9;
}

.onama-container-inner {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}

.onama-story-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.onama-story-text h2 {
    font-size: 2.5rem;
    margin-bottom: 20px;
}

.onama-story-image-box {
    position: relative;
    border-radius: 16px;
        box-shadow:
        0 0 0 1px rgba(95,141,50,0.4),
        0 0 40px rgba(95,141,50,1.35);
}

.onama-main-story-img {
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 30px 60px rgba(0,0,0,0.1);
}

.onama-floating-cert-card {
    position: absolute;
    bottom: -20px;
    right: -20px;
    background: #ccddc1;
    color: #fff;
    padding: 20px;
    border-left: 5px solid #5f8d32;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

/* --- STATS BAR --- */
.onama-stats-bar {
    display: flex;
    justify-content: space-around;
    padding: 60px 0;
    background: #fff;
    border-top: 1px solid #eee;
}

.onama-stat-card {
    text-align: center;
}

.onama-stat-card h3 {
    font-size: 3rem;
    color: #5f8d32;
    margin-bottom: 5px;
}

.onama-stat-card p {
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 1px;
    color: #666;
}

/* Responsive */
@media (max-width: 768px) {
    .onama-hero-section {
        flex-direction: column;
        align-items: stretch;
        min-height: 0;
        padding: 22px 20px 24px;
    }

    .onama-hero-content {
        flex: none;
        padding: 0;
    }

    .onama-hero-content h1 {
        font-size: clamp(1.8rem, 8vw, 2.5rem);
    }

    .onama-hero-visual {
        flex: none;
        width: 100%;
        height: clamp(130px, 38vw, 170px);
        margin-top: 20px;
        background-size: contain;
    }

    .onama-story-section {
        padding: 40px 0 20px;
        scroll-margin-top: 90px;
    }

    .onama-story-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .onama-story-text {
        display: contents;
    }

    .onama-story-text h2 {
        font-size: 2rem;
        grid-row: 1;
    }

    .onama-story-text > p:first-of-type {
        grid-row: 2;
    }

    .onama-story-text > p:nth-of-type(2) {
        grid-row: 3;
    }

    .onama-story-image-box {
        grid-row: 4;
        width: min(100%, 230px);
        justify-self: center;
    }

    .onama-main-story-img {
        display: block;
    }

    .onama-story-grid > .onama-cert-badge {
        grid-row: 5;
        justify-self: center;
        margin-top: 0;
    }

    .onama-floating-cert-card {
        position: static;
        margin-top: 10px;
        color: #315126;
    }

    .onama-stats-bar {
        flex-direction: row;
        gap: 8px;
        padding: 40px 10px;
    }

    .onama-stat-card {
        flex: 1;
        min-width: 0;
    }
}



/* Kontejner za bedž */
.onama-cert-badge {
    margin-top: 20px;
    display: inline-block; /* Sprečava da se raširi preko celog ekrana */
}

/* Stil za link unutar bedža */
.onama-cert-badge a {
    display: flex; /* Stavlja ikonu i tekst jedno pored drugog */
    align-items: center;
    text-decoration: none;
    background: #f9f9f9; /* Blaga pozadina da se istakne */ 
    padding: 10px 15px;
    border: 1px solid #eee;
    border-radius: 5px;
    transition: 0.3s;
}

.onama-cert-badge a:hover {
    background: #f5f5f5;
    border-color: #4a703b; /* Tvoja zlatna boja na hover */ 
}

/* Smanjivanje ikone */
.onama-pdf-icon {
    width: 32px;  /* FIKSNA ŠIRINA IKONE */
    height: auto;
    margin-right: 12px; /* Razmak između slike i teksta */
}

/* Stil za tekst pored ikone */
.onama-cert-badge span {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1a1a1a;
}

/* O nama Story2 */

.onamastory2-section {
    padding: 80px 20px;
    background-color: #f9f9f9;
}

.onamastory2-container {
    max-width: 1100px;
    margin: 0 auto;
}

.onamastory2-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

/* Redosled slike i teksta */
.onamastory2-grid.left-image .onamastory2-image-box {
    order: 1;
}

.onamastory2-grid.left-image .onamastory2-text {
    order: 2;
}

.onamastory2-grid.right-image .onamastory2-image-box {
    order: 2;
}

.onamastory2-grid.right-image .onamastory2-text {
    order: 1;
}

.onamastory2-image-box img {
    width: 100%;
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.1);
}

.onamastory2-text h2 {
    font-size: 2.5rem;
    margin-bottom: 20px;
    color: #1a1a1a;
}

.onamastory2-lead {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 15px;
    color: #333;
}

.onamastory2-body {
    font-size: 1rem;
    line-height: 1.6;
    color: #555;
}

/*/  Onama Info Section */

.onama-container {
    width: 100%;
}

/* --- MODERN ACCORDION (Details/Summary) --- */
.onama-info-accordion {
    background: white;
    margin-bottom: 10px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(49, 184, 90, 0.05);
}

.onama-info-accordion summary {
    padding: 15px 20px;
    font-weight: 600;
    cursor: pointer;
    background: #eee;
    list-style: none;
    transition: background 0.3s;
}

.onama-info-accordion summary:hover { background: #e0e0e0; }

.onama-info-accordion .onama-content {
    padding: 20px;
    border-top: 1px solid #eee;
}

.onama-info-section {
    padding: 40px 20px;
}

.onama-info-section > .onama-container {
    max-width: 1100px;
    margin: 0 auto;
}

.onama-info-section h3 {
    margin-bottom: 1.5rem;
    color: #1a3a5a;
}

.onama-highlight-warning summary {
    background: #fff3cd; /* Svetlo žuta za pažnju */
    color: #856404;
}

/* Responsive */
@media (max-width: 768px) {
    .onamastory2-section {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .onamastory2-grid {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-top: 20px !important;
        scroll-margin-top: 90px;
    }

    .onamastory2-grid.left-image .onamastory2-text,
    .onamastory2-grid.right-image .onamastory2-text {
        order: 1;
    }

    .onamastory2-grid.left-image .onamastory2-image-box,
    .onamastory2-grid.right-image .onamastory2-image-box {
        order: 2;
    }

    .onamastory2-text h2 {
        font-size: clamp(1.8rem, 8vw, 2.2rem);
    }

    .onama-info-section {
        padding-top: 20px;
    }
}



/* ==============================================
   Sertifikati.html stranica
   ============================================== */

   #sertifikati-section {
    padding: 80px 20px;
    background: #f9f9f9;
}

.sertifikati-container {
    width: 100%;
    max-width: none;
    margin: 0;
}

.sertifikati-container h3 { /* Linije ispod imena vrsta sertifikata */
    margin-top: 40px;
    margin-bottom: 20px;
    font-size: 1.8rem;
    color: #1a1a1a;
    border-bottom: 2px solid #5f8d32;
    padding-bottom: 5px;
}

/* Lista sertifikata unutar kategorije */
.sertifikati-list {
    display: flex;
    flex-direction: column; /* vertikalno ređanje */
    gap: 15px; /* razmak između bedževa */
}

/* Bedž sertifikata */
.sertifikat-badge a {
    display: flex;
    width: 100%;
    align-items: center;
    text-decoration: none;
    background: #f9f9f9;
    padding: 10px 15px;
    border: 1px solid #eee;
    border-radius: 5px;
    transition: 0.3s;
}

.sertifikat-badge a:hover {
    background: #f5f5f5;
    border-color: #255a2e;
}

.sertifikat-pdf-icon {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

.sertifikat-badge a {
    display: flex;
    flex-wrap: wrap;      /* OVO DODAJ - omogućava prelamanje u novi red */
    align-items: center;
    gap: 10px;
}

.sertifikat-badge span {
    font-size: 14px;
    font-weight: bold;
    width: auto;         /* Naslov zauzima koliko mu treba */
}
 /* Opis sertifikata i njegova pomeranja + stayle */
.opis-sertifikata {
    flex-basis: 100%;    
    margin-left: 36px;   /* Povećaj na 36px da preskočiš PDF ikonicu iznad */
    font-size: 11px;
    color: #888;
    display: flex;       
    flex-direction: row; /* Forsira ikonicu i tekst u istu liniju */
    flex-wrap: nowrap;   /* Sprečava prelamanje ikonice iznad teksta */
    align-items: center; 
    gap: 5px;            
    margin-top: 2px;     /* Malo ga odvoji od naslova iznad */
}

.opis-sertifikata i {
    font-size: 11px;     /* Info ikonica malo manja od teksta opisa */
    color: #888;
    flex-shrink: 0;      /* Ne dozvoljava ikonici da se smanji ili gura tekst */
    display: inline-block;
}
/* ============================================== */
/* Sertifikati - filter layout and filter styles */
/* ============================================== */
.sertifikati-filter-layout {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    max-width: 1250px;
    margin: 40px auto;
    column-gap: 40px;
    row-gap: 16px;
    padding: 0 20px;
    align-items: flex-start;
}

.sertifikati-filter-sidebar-column {
    grid-column: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.sertifikati-filter-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
}

.sertifikati-filter-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #fff;
    color: #334155;
    font-size: 16px;
    cursor: pointer;
}

.sertifikati-filter-toggle:focus-visible {
    outline: 2px solid #5f8d32;
    outline-offset: 2px;
}

.sertifikati-filter-sidebar {
    position: sticky;
    top: 100px;
    background: #fff;
    padding: 24px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.02);
}

.sertifikati-filter-search-box {
    position: relative;
    width: 100%;
    max-width: 100%;
}

.sertifikati-filter-search-box input {
    width: 100%;
    padding: 10px 35px 10px 14px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    font-size: 13px;
    outline: none;
    background: #f4f6f9;
    transition: all 0.2s;
}

.sertifikati-filter-search-box input:focus {
    border-color: #5f8d32;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(95, 141, 50, 0.1);
}

.sertifikati-filter-search-box i {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
    font-size: 13px;
}

.sertifikati-filter-option {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    cursor: pointer;
    font-size: 14px;
    color: #334155;
    font-weight: 500;
    transition: color 0.2s;
}

.sertifikati-filter-option:hover {
    color: #5f8d32;
}

.sertifikati-filter-checkbox {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    border: 2px solid #cbd5e1;
    border-radius: 50%;
    background: white;
    transition: all 0.2s;
}

.sertifikati-filter-checkbox.active {
    background: #5f8d32;
    border-color: #5f8d32;
    box-shadow: 0 0 0 3px rgba(95, 141, 50, 0.15);
}

.sertifikati-filter-content {
    grid-column: 2;
    min-width: 0;
}

.sertifikati-filter-title {
    display: flex;
    align-items: center;
    text-align: center;
    color: #94a3b8;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 15px;
    font-weight: 700;
}

.sertifikati-filter-title::before,
.sertifikati-filter-title::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid #e2e8f0;
}

.sertifikati-filter-title::before { margin-right: .5em; }
.sertifikati-filter-title::after { margin-left: .5em; }

.sertifikati-filter-content .sertifikati-container > .brand-section:first-of-type > h3 {
    margin-top: 0;
    line-height: 30px;
}

@media (max-width: 992px) {
    .sertifikati-filter-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
        margin: 20px auto;
        padding: 0 15px;
    }

    .sertifikati-filter-sidebar-column {
        grid-column: 1;
    }

    .sertifikati-filter-toolbar {
        gap: 8px;
    }

    .sertifikati-filter-search-box {
        width: auto;
        flex: 1;
    }

    .sertifikati-filter-toggle {
        display: inline-flex;
    }

    .sertifikati-filter-sidebar {
        display: none;
        width: 100%;
        position: relative;
        top: auto;
        padding: 18px;
    }

    .sertifikati-filter-sidebar.sertifikati-filter-open {
        display: block;
    }

    .sertifikati-filter-content {
        grid-column: 1;
        width: 100%;
    }

    .sertifikati-container h3 {
        font-size: 1.5rem;
    }
}

@media (max-width: 480px) {
    .sertifikati-filter-layout {
        padding: 0 10px;
    }

    .sertifikati-container h3 {
        font-size: 1.25rem;
    }

    .sertifikat-badge a {
        align-items: flex-start;
        padding: 10px;
    }

    .opis-sertifikata {
        margin-left: 0;
    }
}
/* ==============================================
   Usluge.html Stranica
   ============================================== */
/* Glavni omotač sa razmakom */
.usluge-sekcija {
  padding: 100px 0;
  background-color: #f4f7f6;
}

.usluge-kontejner {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 50px; /* Širok razmak između kartica */
  perspective: 1500px;
  max-width: 1400px;
  margin: 0 auto;
}

.usluge-kartica {
  width: 400px;  /* Povećana širina */
  height: 550px; /* Povećana dužina */
  background-color: transparent;
}

.usluge-kartica-unutrasnja {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  transform-style: preserve-3d;
  box-shadow: 0 15px 35px rgba(0,0,0,0.1);
  border-radius: 25px;
}

.usluge-kartica:hover .usluge-kartica-unutrasnja {
  transform: rotateY(180deg);
  /* Dodatni suptilni sjaj u tvojoj boji na hover */
  box-shadow: 0 20px 40px rgba(95, 141, 50, 0.2); 
}

.usluge-kartica-prednja, .usluge-kartica-zadnja {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  border-radius: 25px;
  overflow: hidden;
}

/* PREDNJA STRANA */
.usluge-kartica-prednja {
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
}

.usluge-slika-okvir {
  height: 75%; /* Slika dominira */
  width: 100%;
}

.usluge-slika-okvir img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.usluge-naslov-prednji {
  height: 25%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
}

.usluge-naslov-prednji h3 {
  font-size: 1.6rem;
  color: #2c3e50; /* Tamno siva za bolju čitljivost naslova */
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.usluge-tekst-opasnost {
  color: #e74c3c !important; /* Jarka crvena za kontrast */
  font-weight: bold;
}

/* ZADNJA STRANA */
.usluge-kartica-zadnja {
  background-color: #1e2b14; /* Tamno zelena koja vuče na tvoj logo */
  color: #ffffff;
  transform: rotateY(180deg);
  display: flex;
  align-items: flex-end; /* Tekst ide dole */
}

.usluge-sadrzaj-zadnji {
  padding: 40px;
  width: 100%;
}

.usluge-sadrzaj-zadnji h3 {
  font-size: 2rem;
  margin-bottom: 20px;
  border-bottom: 2px solid #5f8d32; /* Tvoja logo boja */
  display: inline-block;
  padding-bottom: 5px;
}

.usluge-sadrzaj-zadnji p {
  font-size: 1.1rem;
  line-height: 1.7;
  margin-bottom: 30px;
  color: #ecf0f1;
}

/* CUSTOM DUGME */
.usluge-dugme {
  display: inline-block;
  padding: 15px 35px;
  background-color: #5f8d32; /* Tvoja logo boja */
  color: #ffffff;
  text-decoration: none;
  border-radius: 50px;
  font-weight: bold;
  font-size: 1rem;
  transition: all 0.4s ease;
  border: 2px solid transparent;
}

.usluge-dugme:hover {
  background-color: transparent;
  border-color: #5f8d32; /* Tvoja logo boja na okviru */
  color: #5f8d32; /* Tvoja logo boja na tekstu */
  transform: scale(1.05);
}

.usluge-btn-danger {
  background-color: #e74c3c; /* Crvena za ŠOK karticu */
}

.usluge-btn-danger:hover {
  border-color: #e74c3c;
  color: #e74c3c;
  background-color: transparent;
  transform: scale(1.05);
}

@media (max-width: 768px) {
    .usluge-sekcija {
        padding: 50px 14px;
    }

    .usluge-kontejner {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
        width: 100%;
    }

    .usluge-kartica {
        width: 100%;
        height: 360px;
    }

    .usluge-kartica:first-child {
        grid-column: 1 / -1;
        width: min(100%, 240px);
        justify-self: center;
    }

    .usluge-slika-okvir {
        height: 65%;
    }

    .usluge-naslov-prednji {
        height: 35%;
        padding: 0 12px;
    }

    .usluge-naslov-prednji h3 {
        font-size: 1rem;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .usluge-kontejner {
        gap: 16px;
    }

    .usluge-kartica {
        height: 360px;
    }

    .usluge-naslov-prednji h3 {
        font-size: 1rem;
    }
}

@media (max-width: 360px) {
    .usluge-kontejner {
        grid-template-columns: 1fr;
    }

    .usluge-kartica,
    .usluge-kartica:first-child {
        grid-column: auto;
        width: min(100%, 320px);
        justify-self: center;
        height: 400px;
    }

    .usluge-naslov-prednji h3 {
        font-size: 1.25rem;
    }
}

/* ==============================================
   Usluge.html Stranica - Briga o sistemu
   ============================================== */

   .usluge-info-sekcija {
  padding: 80px 0;
  background-color: #ffffff; /* Da se razlikuje od one sive iznad */
}

.usluge-info-kontejner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  gap: 80px;
  align-items: center;
  padding: 0 20px;
}

.usluge-info-tekst h2 {
  font-size: 2.5rem;
  color: #1e2b14;
  margin-bottom: 20px;
}

.usluge-lista {
  margin-top: 30px;
}

.usluge-stavka {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 15px;
}

.usluge-cek {
  color: #5f8d32;
  font-weight: bold;
  font-size: 1.2rem;
  background: rgba(95, 141, 50, 0.1);
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.usluge-info-stats {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.usluge-stat-box {
  background: #1e2b14;
  color: white;
  padding: 30px;
  border-radius: 20px;
  text-align: center;
  min-width: 200px;
  border-left: 5px solid #5f8d32;
}

.usluge-procenat {
  font-size: 2rem;
  font-weight: bold;
  color: #5f8d32;
  margin-top: 10px;
}

@media (max-width: 768px) {
    .usluge-info-sekcija {
        padding: 50px 0;
    }

    .usluge-info-kontejner {
        flex-direction: column;
        align-items: stretch;
        gap: 30px;
        width: 100%;
    }

    .usluge-info-tekst {
        min-width: 0;
    }

    .usluge-info-tekst h2 {
        font-size: clamp(1.7rem, 7vw, 2.5rem);
    }

    .usluge-info-stats {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .usluge-stat-box {
        min-width: 0;
        padding: 20px 12px;
    }

    .faq-item summary,
    .faq-odgovor {
        overflow-wrap: anywhere;
    }
}

/* ==============================================
   Usluge.html FAQ
   ============================================== */

.faq-sekcija {
    max-width: 800px;
    margin: 50px auto;
    padding: 0 20px;
    font-family: sans-serif;
}

.faq-naslov {
    text-align: center;
    color: #1a1a1a;
    margin-bottom: 30px;
}

/* Stil za svako pojedinačno pitanje */
.faq-item {
    background: #ffffff;
    border-radius: 15px; /* Zaobljeni uglovi kao na tvojim karticama */
    margin-bottom: 15px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1); /* Blaga senka */
    overflow: hidden;
    transition: all 0.3s ease;
}

/* Stil za naslov pitanja na koji se klikće */
.faq-item summary {
    padding: 20px;
    font-weight: bold;
    cursor: pointer;
    list-style: none; /* Sakriva defaultnu strelicu u nekim browserima */
    position: relative;
    color: #2d5a27; /* Tamno zelena boja tvojih kvačica */
}

/* Dodajemo našu strelicu koja se okreće */
.faq-item summary::after {
    content: '▼';
    position: absolute;
    right: 20px;
    transition: transform 0.3s;
    font-size: 0.8rem;
}

/* Okretanje strelice kada je otvoreno */
.faq-item[open] summary::after {
    transform: rotate(180deg);
}

/* Stil za odgovor koji se pojavljuje */
.faq-odgovor {
    padding: 0 20px 20px 20px;
    line-height: 1.6;
    color: #555;
    border-top: 1px solid #f0f0f0;
    padding-top: 15px;
}


/* ==============================================
   Princip.html Stranica
   ============================================== */


.onama-container {
    width: 100%;
}

/* --- MODERN ACCORDION (Details/Summary) --- */
.onama-info-accordion {
    background: white;
    margin-bottom: 10px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(49, 184, 90, 0.05);
}

.onama-info-accordion summary {
    padding: 15px 20px;
    font-weight: 600;
    cursor: pointer;
    background: #eee;
    list-style: none;
    transition: background 0.3s;
}

.onama-info-accordion summary:hover { background: #e0e0e0; }

.onama-info-accordion .onama-content {
    padding: 20px;
    border-top: 1px solid #eee;
}

.onama-info-section {
    padding: 40px 20px;
}

.onama-info-section > .onama-container {
    max-width: 1100px;
    margin: 0 auto;
}

.onama-info-section h3 {
    margin-bottom: 1.5rem;
    color: #1a3a5a;
}

.onama-highlight-warning summary {
    background: #fff3cd; /* Svetlo žuta za pažnju */
    color: #856404;
}

/* TEstiranje novih stvari za princip rada */