/* =========================================
   1. FONTI UN PAMATA IESTATĪJUMI
   ========================================= */
/* Mēs vairs neizmantojam @import, jo tas ir lēnāks. Fonti ir ielādēti index.html */

:root {
    --primary-color: #28c3ab; /* SubLevel Zaļais */
    --secondary-color: #333333; /* Tumši pelēkais */
    --hover-color: #111111;
    --light-bg: #f8f8f8;
}

body {
    width: 100%;
    height: 100%;
    /* NOMAINĪTS UZ OPEN SANS - Labāks latviešu valodas atbalsts */
    font-family: 'Open Sans', sans-serif; 
    font-weight: 400; /* 300 bija pārāk tievs, 400 ir vieglāk lasāms */
    color: #666;
    background-color: #fff;
    overflow-x: hidden;
}

/* Virsrakstiem atstājam Montserrat, jo tas labi atbalsta LV un izskatās stilīgi */
h1, h2, h3, h4, h5, h6 {
    margin: 0 0 20px;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif; 
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--secondary-color);
}

/* Pārējais kods paliek tāds pats... */
p {
    font-size: 16px;
    line-height: 1.6em;
    margin-bottom: 20px;
}

/* =========================================
   2. NAVIGĀCIJA (NAVBAR)
   ========================================= */
.navbar {
    background-color: var(--secondary-color);
    padding: 15px 0;
    transition: padding 0.3s;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.navbar-brand {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    letter-spacing: 1px;
    font-size: 20px;
}

.nav-link {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    color: rgba(255,255,255,0.9) !important;
}

.nav-link:hover,
.nav-link.active {
    color: var(--primary-color) !important;
}

/* =========================================
   3. HERO SEKCIJA (INTRO)
   ========================================= */
#intro {
    width: 100%;
    /* Noņemam fiksēto augstumu, lai nav baltu svītru */
    height: auto; 
    min-height: 600px;
    
    /* Pieliekam "gaisu", lai teksts ir vidū */
    padding: 150px 0; 
    position: relative;
    
    /* --- SVARĪGĀKĀ VIETA --- */
    /* 1. Divi punkti "../" nozīmē iziet no css mapes */
    /* 2. Pārbaudi faila nosaukumu mapē! Vai ir .jpg vai .JPG? */
    /* Ja failam mapē ir lielie burti, šeit OBLIGĀTI jābūt .JPG */
    background: url('../img/SubLevel_webpage_home.webp') no-repeat center center;
    
    /* Nodrošina, ka bilde ir pa visu ekrānu */
    background-size: cover; 
    
    /* Scroll ir drošākais variants, lai bilde nepazūd mobilajos */
    background-attachment: scroll;
    
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
}
/* --- IEKOPĒ ŠO TIEŠI ZEMĀK --- */
#intro h1, 
#intro h4 {
    /* Melna ēna, kas ir izplūdusi, lai teksts "lec ārā" */
    text-shadow: 0px 4px 15px rgba(0, 0, 0, 0.9);
}
/* MOBILĀ VERSIJA (Ekrāniem līdz 768px) */
@media (max-width: 768px) {
    #intro {
        padding: 100px 0; /* Mazāks "gaiss" telefonos, lai saturs ir tuvāk */
        min-height: 400px;
    }
    
    /* Ja virsraksts mobilajā ir par lielu, to var nedaudz samazināt */
    #intro h1 {
        font-size: 30px; 
    }
}
/* =========================================
   4. POGAS (BUTTONS)
   ========================================= */
.btn {
    border-radius: 0; /* Kvadrātveida stils */
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    letter-spacing: 1px;
    transition: all 0.3s ease-in-out;
}

.btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
}

.btn-primary:hover {
    background-color: var(--hover-color);
    border-color: var(--hover-color);
}

.btn-outline-light:hover {
    background-color: #fff;
    color: #000;
}

/* =========================================
   5. PAKALPOJUMU KARTIŅAS (SERVICES)
   ========================================= */
.service-card {
    border: none; /* Noņemam standarta līniju */
    background: #fff;
    
    /* Šīs divas rindiņas padara stūrus apaļus */
    border-radius: 20px; 
    overflow: hidden; /* Nodrošina, lai saturs neietu pāri apaļajiem stūriem */

    /* Šī rindiņa nodrošina vienādu augstumu */
    height: 100%; 

    /* Ēna, lai izceltu bloku */
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.service-card:hover {
    transform: translateY(-10px); /* Paceļas uz augšu, kad uzbrauc ar peli */
    box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}

/* Papildus stils sarakstam iekšā, lai tas izskatītos glīti */
.service-card ul li {
    padding: 5px 0;
    border-bottom: 1px solid #f0f0f0; /* Smalka līnija starp saraksta punktiem */
}

.service-card ul li:last-child {
    border-bottom: none;
}
/* --- MOBILĀ VERSIJA (Ekrāniem līdz 768px) --- */
@media (max-width: 768px) {
    .service-card {
        /* Šeit mēs palielinām balto rāmīti ap bildi telefonos */
        padding: 15px !important; 
    }
}
/* --- BILŽU IESTATĪJUMI KARTIŅĀS --- */

/* 1. Rāmja fons (lai tukšās vietas būtu baltas, nevis caurspīdīgas) */
.service-icon {
    height: 250px;
    width: 100%;
    border-radius: 15px; 
    overflow: hidden;
    position: relative;
    background-color: #fff; /* Pievienots balts fons */
}

/* 2. Pati bilde */
.service-icon img {
    width: 100%;
    height: 100%;
    
    /* MAINĀM ŠO RINDIŅU: */
    /* 'contain' nozīmē: Rādīt visu bildi, neko negriežot (var parādīties baltas malas) */
    /* 'fill' nozīmē: Izstiept bildi pa visu rāmi (var izskatīties saspiesta) */
    
    object-fit: contain;  /* Iesaku šo logotipiem un preču bildēm */
    
    object-position: center;
    transition: transform 0.5s ease;
}

/* Zoom efekts */
.service-card:hover .service-icon img {
    /* Nedaudz palielina visu bildi, kad uzbrauc */
    transform: scale(1.05);
}

/* =========================================
   6. ATTĒLI UN GALERIJA (MODERNIZĒTS)
   ========================================= */

/* Pamatstāvoklis bildēm */
.avatar img {
    /* Noņemam veco rāmi */
    border: none !important; 
    
    /* Noapaļoti stūri */
    border-radius: 15px !important; 
    
    /* Gluda animācija visām izmaiņām */
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    
    /* Neliela ēna sākumā */
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    
    /* Nodrošinām, ka bilde aizpilda vietu */
    width: 100%;
    object-fit: cover;
}

/* Efekts, kad uzbrauc ar peli (HOVER) */
.avatar:hover img {
    /* Bilde pietuvinās (Zoom) */
    transform: scale(1.05); 
    
    /* Ēna kļūst izteiktāka */
    box-shadow: 0 20px 40px rgba(0,0,0,0.25);
    
    /* Bilde kļūst nedaudz košāka */
    filter: brightness(1.1);
    
    /* Vecā rāmja krāsa vairs nav vajadzīga, tāpēc to šeit nerakstām */
}

/* =========================================
   7. KONTAKTI UN FOOTER
   ========================================= */
.contact-icon {
    color: var(--primary-color);
    min-width: 30px;
    text-align: center;
}

.gmap_iframe {
    border-radius: 4px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

footer {
    background-color: var(--secondary-color);
    padding: 30px 0;
    color: #fff;
    font-size: 14px;
}

/* =========================================
   8. UTILITIES (PALĪGRĪKI)
   ========================================= */
.section-heading {
    margin-bottom: 60px;
}

.section-heading i {
    color: #ddd;
    animation: bounce 2s infinite;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-10px);}
    60% {transform: translateY(-5px);}
}
/* Navigācijas joslas uzvedība ritinot */
#mainNav {
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #333; /* Noklusējuma krāsa */
    transition: padding 0.3s ease-in-out, background-color 0.3s ease-in-out;
}

#mainNav.navbar-shrink {
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: rgba(0, 0, 0, 0.95); /* Kļūst tumšāks un kompaktāks */
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}
/* =========================================
   MOBILĀ VERSIJA (Ekrāniem līdz 768px)
   ========================================= */
@media (max-width: 768px) {
    #intro {
        /* 1. 'cover' liks bildei aizpildīt visu ekrānu (nogriežot malas) */
        background-size: cover !important;

        /* 2. Centrējam bildi, lai redzētu svarīgāko (vidu) */
        background-position: center center !important;

        /* 3. SVARĪGI: Uzliekam minimālo augstumu */
        /* Ja to neuzliks, bilde būs šaura. 500px padarīs to "lielu". */
        min-height: 500px !important; 

        /* Sakārtojam teksta atstarpes */
        padding: 100px 20px !important;
        
        /* Lai bilde "nelec" skrollējot */
        background-attachment: scroll !important;
    }
    
    /* Pielāgojam virsraksta izmēru, lai neaizņem visu bildi */
    #intro h1 {
        font-size: 32px; 
        text-shadow: 0px 4px 10px rgba(0,0,0,0.8); /* Stiprāka ēna tekstam */
    }
}
/* =========================================
   UZLABOTS SARAKSTA IZSKATS
   ========================================= */

.service-card ul li a {
    /* 1. Padarām tekstu tumšāku un kontrastaināku */
    color: #2c2c2c !important; 
    
    /* 2. Nedaudz biezāks fonts (nevis Bold, bet Medium) */
    font-weight: 600;
    
    /* 3. Nedaudz palielinām fontu, ja tas liekas par mazu (pēc izvēles) */
    font-size: 15px; 
    
    /* Pārejas efekts */
    transition: all 0.2s ease-in-out;
    display: inline-block;
    text-decoration: none;
}

/* Hover efekts paliek tas pats - tirkīza */
.service-card ul li:hover a {
    color: #28c3ab !important; 
    transform: translateX(5px);
}

/* Ikonas krāsa un efekts */
.service-card ul li i {
    color: #28c3ab; 
    /* ŠEIT BIJA KĻŪDA - rindiņa "font-weight: normal" ir jāizdzēš! */
    /* Font Awesome ikonām obligāti jābūt savam noklusētajam biezumam */
}

.service-card ul li:hover i {
    transform: scale(1.1);
    transition: all 0.2s;
}
/* --- LIGHTBOX UN GALERIJAS STILI --- */

/* Kursors uz sākumlapas bildēm */
.clickable-img {
    cursor: pointer;
    transition: transform 0.2s ease;
}
.clickable-img:hover {
    transform: scale(1.02);
}

/* Lightbox fons */
.lightbox {
    display: none; /* Sākumā neredzams */
    position: fixed;
    z-index: 10000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.95);
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.lightbox.active {
    display: flex; /* Parādās */
}

/* Bilde un saturs */
.lightbox-content {
    position: relative;
    max-width: 90%;
    max-height: 80%;
    text-align: center;
}
.lightbox img {
    max-width: 100%;
    max-height: 80vh;
    border-radius: 4px;
    box-shadow: 0 0 20px rgba(0,0,0,0.5);
}
.lightbox-caption-container {
    color: white;
    margin-top: 10px;
    font-family: 'Montserrat', sans-serif;
}
#imageCounter {
    display: block;
    font-size: 0.8em;
    color: #bbb;
    margin-top: 5px;
}

/* POGAS */
.close-btn {
    position: absolute;
    top: 20px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    z-index: 10001;
    transition: color 0.3s;
}
.close-btn:hover { color: #fff; }

.nav-btn {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 30px;
    transition: 0.3s;
    user-select: none;
    z-index: 10000;
    background: rgba(0,0,0,0.1);
    border-radius: 3px;
}
.nav-btn:hover { background-color: rgba(255, 255, 255, 0.2); }
.prev { left: 20px; }
.next { right: 20px; }

/* Mobilajiem telefoniem */
@media (max-width: 768px) {
    .nav-btn { font-size: 20px; padding: 10px; }
    .prev { left: 10px; }
    .next { right: 10px; }
}
/* --- SĀKUMLAPAS LIGHTBOX STILI (NEITRĀLI) --- */

/* Kursors uz bildēm */
.clickable-img {
    cursor: pointer;
    transition: transform 0.2s ease;
}
.clickable-img:hover {
    transform: scale(1.02);
}

/* Lightbox fons (Vienmēr tumšs, lai izceltu bildi) */
.lightbox {
    display: none;
    position: fixed;
    z-index: 10000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.95);
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.lightbox.active {
    display: flex;
}

/* Lightbox saturs */
.lightbox-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 90%;
    max-height: 85%;
    position: relative;
}

.lightbox img {
    max-width: 100%;
    max-height: 70vh;
    border-radius: 4px;
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
}

#lightbox-caption {
    color: #ddd;
    margin-top: 10px;
    font-size: 1.1rem;
    text-align: center;
}

/* Aizvēršanas krustiņš */
.close-btn {
    position: absolute;
    top: 20px;
    right: 30px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    z-index: 10002;
    transition: color 0.2s;
}
.close-btn:hover { color: #ccc; }

/* Navigācijas bultiņas */
.nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: white;
    font-size: 50px;
    font-weight: bold;
    padding: 20px;
    cursor: pointer;
    user-select: none;
    z-index: 10001;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 5px;
    transition: background 0.3s ease;
}

.nav-btn:hover { background-color: rgba(0, 0, 0, 0.8); }
.prev-btn { left: 10px; }
.next-btn { right: 10px; }

@media (max-width: 768px) {
    .nav-btn {
        font-size: 30px;
        padding: 10px;
    }
}

.counter {
    position: absolute;
    top: 20px;
    left: 20px;
    color: #a0a0a0;
    font-size: 14px;
    z-index: 10001;
}

/* Pogas zem bildes (Zvanīt/Rakstīt) */
.lightbox-cta {
    margin-top: 15px;
    pointer-events: auto;
}

.cta-buttons {
    display: flex;
    gap: 15px;
    justify-content: center;
}

.cta-btn {
    text-decoration: none;
    padding: 8px 18px;
    font-size: 0.9rem;
    border-radius: 50px;
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    text-transform: uppercase;
}

.cta-btn:hover {
    background-color: #fff;
    color: #000;
}
/* Bloga virsraksta hover efekts */
.hover-green {
    transition: color 0.3s;
}
.hover-green:hover {
    color: var(--primary-color) !important;
}
/* =========================================
   FIX PRIEKŠ ENKURIEM (LAI MENU NEAIZSEDZ SATURU)
   ========================================= */
section, #contact, #pakalpojumi, #faq {
    scroll-margin-top: 100px;
}

@media (max-width: 768px) {
    section, #contact, #pakalpojumi, #faq {
        scroll-margin-top: 80px; /* Mobilajiem mazāka atstarpe */
    }
}