/* ================================================================
 * SAKUROS – LP „Paslauga" (vidinis paslaugos puslapis) stiliai
 *
 * Kraunamas PO sakuros-base.css. Naudoja tą pačią bazinę tipografiją
 * (.lp-pagrindinis) ir siauresnę (1360px) skalę kaip pagrindinis puslapis –
 * .lp-paslauga-page wrapper'yje perrašomi --sk-* kintamieji.
 *
 * Sekcijos: hero, ivadas, kam-skirta, apima (akordeonas), kodel, duk, cta.
 * ============================================================== */

/* ----------------------------------------------------------------
 * SKALĖ (kaip siauresnis 1360px variantas)
 * -------------------------------------------------------------- */
.lp-paslauga-page {
    --sk-container: 1360px;
    --sk-container-wide: 1456px;

    --sk-fs-h1: clamp(52px, 5.1vw, 92px);
    --sk-fs-h2: clamp(34px, 3.91vw, 60px);
    --sk-fs-h2-cta: clamp(40px, 4.6vw, 76px);
    --sk-fs-card-title: clamp(24px, 2.4vw, 37px);
    --sk-fs-lead: clamp(17px, 1.61vw, 25px);
    --sk-fs-sub: clamp(16px, 1.67vw, 26px);
    --sk-fs-list: clamp(16px, 1.82vw, 28px);
    --sk-fs-body: clamp(15px, 1.3vw, 20px);
    --sk-fs-btn: clamp(13px, 1.2vw, 19px);
}

/* --- Avada wrapper'io nulinimas --- */
.page-template-lp-paslauga #main {
    padding: 0 !important;
}
.page-template-lp-paslauga #main .fusion-row {
    max-width: 100% !important;
}
.page-template-lp-paslauga #content {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
}
@media (max-width: 640px) {
    .page-template-lp-paslauga #main .fusion-column-wrapper {
        margin: 0 !important;
    }
}

/* ----------------------------------------------------------------
 * HERO – auksinė antraštė + du mygtukai ant tamsaus fono
 * -------------------------------------------------------------- */
.lp-psvc-hero {
    position: relative;
    background: var(--sk-gradient-navy);
}
.lp-psvc-hero--su-fonu {
    background-size: cover;
    background-position: center;
}
.lp-psvc-hero__inner {
    max-width: calc(var(--sk-container) + 64px);
    margin: 0 auto;
    padding: clamp(56px, 6vw, 110px) 32px;
    min-height: clamp(300px, 30vw, 460px);
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.lp-psvc-hero__title {
    color: var(--sk-gold) !important;
    /* Bendras variantas: mažesnis maks. dydis + platesnis maks. plotis –
       trumpi pavadinimai lūžta per 2 eilutes, ilgi (pvz. „PRAGMA mokymai ir
       apskaitos procesų konsultacijos") gražiai telpa per 3, o ne 5 eilutes. */
    font-size: clamp(44px, 4.4vw, 70px) !important;
    line-height: 1.07 !important;
    max-width: 9.5em;
}
.lp-psvc-hero .lp-btn-row {
    margin-top: clamp(28px, 3vw, 52px);
}
/* Mažesni hero ir CTA mygtukai (dizainerės pastaba). */
.lp-psvc-hero .btn-sakuros,
.lp-psvc-cta .btn-sakuros {
    font-size: clamp(12px, 1.05vw, 16px);
    padding: clamp(9px, 0.8vw, 13px) clamp(20px, 1.7vw, 32px);
    letter-spacing: 1.5px;
}

/* ----------------------------------------------------------------
 * Sekcijų antraštės – lygiuojamos KAIRĖJE (kaip PDF), ne centre.
 * -------------------------------------------------------------- */
.lp-paslauga-page .lp-section-head {
    text-align: left;
}

/* ----------------------------------------------------------------
 * Skiriamosios linijos TARP blokų (konteinerio pločio, centre).
 * -------------------------------------------------------------- */
.lp-psvc-kam,
.lp-psvc-apima,
.lp-psvc-kodel,
.lp-psvc-duk,
.lp-psvc-cta {
    position: relative;
}
.lp-psvc-kam::before,
.lp-psvc-apima::before,
.lp-psvc-kodel::before,
.lp-psvc-duk::before,
.lp-psvc-cta::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 64px);
    max-width: var(--sk-container);
    height: 2px;
    background: rgb(10 37 77);
}

/* ----------------------------------------------------------------
 * ĮVADAS – tekstas kairėje + nuotrauka dešinėje (su auksiniu rėmeliu)
 * -------------------------------------------------------------- */
.lp-psvc-ivadas {
    padding: clamp(36px, 3.6vw, 60px) 0;
    background: var(--sk-white);
}
.lp-psvc-ivadas__grid {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: clamp(32px, 4vw, 80px);
    align-items: center;
}
.lp-psvc-ivadas__title {
    font-size: var(--sk-fs-h2) !important;
    line-height: 1.12 !important;
    margin-bottom: clamp(18px, 1.8vw, 32px) !important;
    max-width: 14em;
}
.lp-psvc-ivadas__text {
    max-width: 35em;
}
.lp-psvc-ivadas__text p {
    font-size: clamp(17px, 1.55vw, 24px); /* ~24px desktop (dizainerės pastaba) */
    line-height: 1.5;
}
.lp-psvc-ivadas__text p + p {
    margin-top: clamp(14px, 1.2vw, 22px);
}
/* Įvado nuotrauka – be rėmelio (kliento pastaba). */
.lp-psvc-ivadas__media img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: clamp(8px, 0.7vw, 12px);
}

/* ----------------------------------------------------------------
 * KAM SKIRTA – kortelės su bendru fonu (tamsios, gradientas + foto)
 * -------------------------------------------------------------- */
.lp-psvc-kam {
    padding: clamp(36px, 3.6vw, 60px) 0;
    background: var(--sk-white);
}
.lp-psvc-kam__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(18px, 1.9vw, 34px);
}
.lp-psvc-kam__card {
    position: relative;
    overflow: hidden;
    border-radius: clamp(12px, 1vw, 18px);
    background-color: var(--sk-navy);
    background-size: cover;
    background-position: center;
    min-height: clamp(120px, 11vw, 180px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(20px, 2vw, 36px);
    text-align: center;
}
/* Fono overlay nenaudojam – nuotrauka jau patamsinta (kliento pastaba). */
.lp-psvc-kam__text {
    position: relative;
    z-index: 1;
    color: var(--sk-white);
    font-family: var(--sk-sans);
    font-weight: 600;
    font-size: var(--sk-fs-sub);
    line-height: 1.3;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45);
}

/* ----------------------------------------------------------------
 * AKORDEONAS (Ką apima + DUK) – native <details>
 * -------------------------------------------------------------- */
.lp-psvc-apima,
.lp-psvc-duk {
    padding: clamp(36px, 3.6vw, 60px) 0;
    background: var(--sk-white);
}
.lp-psvc-acc {
    display: flex;
    flex-direction: column;
    gap: clamp(14px, 1.3vw, 22px);
    /* Per visą turinio plotį (dizainerės pastaba) – be max-width. */
}
.lp-psvc-acc__item {
    border: 1px solid var(--sk-navy);
    border-radius: clamp(12px, 1vw, 18px);
    background: var(--sk-white);
    overflow: hidden;
}
.lp-psvc-acc__head {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: clamp(18px, 1.8vw, 30px) clamp(20px, 2vw, 36px);
}
.lp-psvc-acc__head::-webkit-details-marker {
    display: none;
}
.lp-psvc-acc__title {
    font-family: var(--sk-serif);
    color: var(--sk-navy);
    font-size: clamp(21px, 1.9vw, 30px);
    line-height: 1.2;
    letter-spacing: 0.5px;
}
/* +/− ikona */
.lp-psvc-acc__icon {
    position: relative;
    flex: 0 0 auto;
    width: clamp(26px, 2vw, 34px);
    height: clamp(26px, 2vw, 34px);
    border-radius: 50%;
    border: 1px solid var(--sk-navy);
}
.lp-psvc-acc__icon::before,
.lp-psvc-acc__icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 44%;
    height: 2px;
    background: var(--sk-navy);
    transform: translate(-50%, -50%);
    transition: opacity 0.2s ease, transform 0.2s ease;
}
.lp-psvc-acc__icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
}
.lp-psvc-acc__item[open] .lp-psvc-acc__icon::after {
    opacity: 0;
}
.lp-psvc-acc__body {
    padding: 0 clamp(20px, 2vw, 36px) clamp(20px, 2vw, 34px);
}
.lp-psvc-acc__intro {
    font-size: var(--sk-fs-body);
    margin-bottom: clamp(10px, 1vw, 16px);
}
.lp-psvc-acc__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: clamp(8px, 0.8vw, 14px);
}
.lp-psvc-acc__list li {
    padding-left: clamp(30px, 2.4vw, 42px);
    font-family: var(--sk-sans);
    font-weight: var(--sk-fw-body);
    font-size: var(--sk-fs-body);
    line-height: 1.4;
    color: var(--sk-text);
    /* Mėlynas „lapelis" ženkliukas (ant balto fono – kaip kalendoriuje). */
    background: url("../assets/svg/bullet-melynas.svg") no-repeat left 0.2em;
    background-size: clamp(18px, 1.3vw, 24px) auto;
}
.lp-psvc-acc__body p {
    font-size: var(--sk-fs-body);
    line-height: 1.5;
}

/* ----------------------------------------------------------------
 * KODĖL VERTA – tamsus boxas (gold H2 + checklist) + nuotrauka
 * -------------------------------------------------------------- */
.lp-psvc-kodel {
    padding: clamp(36px, 3.6vw, 60px) 0;
    background: var(--sk-white);
}
.lp-psvc-kodel__box {
    /* Fonas – ACF nuotrauka (inline background-image, kaip hero/CTA);
       be jos lieka standartinis tamsus gradientas. Jokių papildomų spalvų. */
    background-color: var(--sk-navy);
    background-image: var(--sk-gradient-navy);
    border-radius: clamp(16px, 1.25vw, 24px);
    padding: clamp(32px, 4.4vw, 85px) clamp(24px, 4.4vw, 85px);
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: clamp(32px, 4.7vw, 90px);
    align-items: center;
}
.lp-psvc-kodel__box--su-fonu {
    background-size: cover;
    background-position: center;
}
.lp-psvc-kodel__title {
    font-size: clamp(46px, 5.1vw, 86px) !important;
    line-height: 1.0 !important;
    margin-bottom: clamp(18px, 1.8vw, 32px) !important;
    max-width: 14em;
}
.lp-psvc-kodel__intro {
    color: var(--sk-white) !important;
    font-size: var(--sk-fs-sub);
    line-height: 1.4;
    margin-bottom: clamp(18px, 1.8vw, 30px);
}
.lp-psvc-kodel__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: clamp(10px, 1vw, 18px);
}
.lp-psvc-kodel__list li {
    padding-left: clamp(30px, 2.3vw, 42px);
    color: var(--sk-white);
    font-family: var(--sk-sans);
    font-weight: var(--sk-fw-body);
    font-size: clamp(15px, 1.45vw, 22px);
    line-height: 1.3;
    /* Auksinis „lapelis" ženkliukas (kaip pagrindiniame puslapyje). */
    background: url("../assets/svg/bullet-geltonas.svg") no-repeat left 0.1em;
    background-size: clamp(19px, 1.5vw, 25px) auto;
}
.lp-psvc-kodel__media img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: clamp(10px, 0.9vw, 16px);
}

/* ----------------------------------------------------------------
 * CTA – tamsus boxas (gold antraštė + du mygtukai) + nuotrauka
 * -------------------------------------------------------------- */
.lp-psvc-cta {
    padding: clamp(36px, 3.6vw, 60px) 0 clamp(48px, 5vw, 80px);
    background: var(--sk-white);
}
/* Suvienodinta su pagrindinio puslapio CTA (padding / dydis / spalva). */
.lp-psvc-cta__box {
    background-color: var(--sk-navy); /* solid navy, be gradiento */
    border-radius: clamp(16px, 1.25vw, 19px);
    padding: clamp(32px, 4.4vw, 68px) clamp(24px, 6.2vw, 96px);
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: clamp(32px, 4.7vw, 72px);
    align-items: center;
}
.lp-psvc-cta__box--su-fonu {
    background-size: cover;
    background-position: center;
}
.lp-psvc-cta__title {
    font-size: var(--sk-fs-h2-cta) !important;
    line-height: 1.0 !important;
}

/* Dviejų spalvų antraštės (auksinė dalis + balta dalis). */
.lp-psvc-kodel__title .lp-psvc-title-gold,
.lp-psvc-cta__title .lp-psvc-title-gold {
    display: block;
    color: var(--sk-gold);
}
.lp-psvc-kodel__title .lp-psvc-title-white,
.lp-psvc-cta__title .lp-psvc-title-white {
    display: block;
    color: var(--sk-white);
}
.lp-psvc-cta__media {
    display: flex;
    justify-content: flex-end;
}
.lp-psvc-cta__media img {
    width: 100%;
    max-width: 520px;
    height: auto;
    display: block;
    border-radius: clamp(10px, 0.9vw, 16px);
}

/* ----------------------------------------------------------------
 * RESPONSIVE
 * -------------------------------------------------------------- */
@media (min-width: 1025px) and (max-width: 1500px) {
    .lp-psvc-hero__inner {
        padding-left: clamp(48px, 6vw, 96px);
        padding-right: clamp(48px, 6vw, 96px);
    }
}

@media (max-width: 1024px) {
    .lp-psvc-ivadas__grid,
    .lp-psvc-kodel__box,
    .lp-psvc-cta__box {
        grid-template-columns: 1fr;
    }
    .lp-psvc-ivadas__media,
    .lp-psvc-kodel__media,
    .lp-psvc-cta__media {
        order: -1;
        max-width: 560px;
    }
    .lp-psvc-kam__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .lp-psvc-hero__inner {
        padding-left: 16px;
        padding-right: 16px;
    }
    .lp-psvc-kam__grid {
        grid-template-columns: 1fr;
    }
}
