/* =========================================================
   MARYNAPSY ONBOARDING
========================================================= */
 
:root {
    --mp-gold: #e7b200;
    --mp-gold-dark: #c99900;
    --mp-gold-soft: #ffe9a0;
    --mp-gold-pale: #fff8df;
    --mp-background: #fffaf0;
    --mp-text: #302b24;
    --mp-text-soft: #6b6258;
    --mp-border: rgba(231, 178, 0, 0.17);
}
 
 
/* =========================================================
   MAŽAS ATIDARYMO MYGTUKAS
========================================================= */
 
.mp-open-button {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 999990;
 
    display: inline-flex;
    align-items: center;
    gap: 9px;
 
    padding: 13px 19px;
 
    border: 1px solid rgba(231, 178, 0, 0.26);
    border-radius: 999px;
 
    background: rgba(255, 251, 239, 0.96);
    color: #554a34;
 
    box-shadow:
        0 12px 32px rgba(70, 54, 17, 0.14),
        0 2px 8px rgba(70, 54, 17, 0.07);
 
    font-family: inherit;
    font-size: 15px;
    font-weight: 650;
    line-height: 1;
 
    cursor: pointer;
 
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
 
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background-color 0.25s ease;
}
 
.mp-open-button:hover {
    transform: translateY(-3px);
    background: #fff5d5;
 
    box-shadow:
        0 16px 38px rgba(70, 54, 17, 0.18),
        0 3px 10px rgba(70, 54, 17, 0.09);
}
 
/* Išlaikyti svetainės temos mygtuko spalvas visose būsenose. */
button#mp-open-button:hover,
button#mp-open-button:focus,
button#mp-open-button:focus-visible,
button#mp-open-button:active {
    color: #554a34 !important;
    background: #fff5d5 !important;
}
button#mp-open-button:not(:hover):focus,
button#mp-open-button:not(:hover):focus-visible,
button#mp-open-button:not(:hover):active {
    background: rgba(255, 251, 239, 0.96) !important;
}
 
.mp-open-button:focus-visible {
    outline: 3px solid rgba(231, 178, 0, 0.3);
    outline-offset: 4px;
}
 
.mp-open-button-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    overflow: hidden;
    border-radius: 50%;
    background: #ffbd2e;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.28);
}
.mp-open-button-logo {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}
 
 
/* =========================================================
   OVERLAY
========================================================= */
 
.mp-welcome-overlay {
    position: fixed;
    inset: 0;
    z-index: 999999;
 
    display: flex;
    align-items: center;
    justify-content: center;
 
    padding: 24px;
 
    background: rgba(32, 29, 22, 0.59);
 
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
 
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
 
    transition:
        opacity 0.3s ease,
        visibility 0.3s ease;
}
 
.mp-welcome-overlay.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
 
 
/* =========================================================
   PAGRINDINĖ KORTELĖ
========================================================= */
 
.mp-card {
    position: relative;
 
    width: 100%;
    max-width: 820px;
    max-height: calc(100vh - 48px);
 
    overflow-x: hidden;
    overflow-y: auto;
 
    border: 1px solid var(--mp-border);
    border-radius: 30px;
 
    background:
        radial-gradient(
            circle at 92% 2%,
            rgba(255, 228, 132, 0.38) 0,
            rgba(255, 228, 132, 0.18) 22%,
            transparent 45%
        ),
        radial-gradient(
            circle at 2% 98%,
            rgba(255, 241, 190, 0.6) 0,
            rgba(255, 241, 190, 0.15) 26%,
            transparent 48%
        ),
        linear-gradient(
            180deg,
            #fffdf8 0%,
            #fff9eb 100%
        );
 
    box-shadow:
        0 28px 80px rgba(0, 0, 0, 0.23);
 
    opacity: 0;
    transform: translateY(24px) scale(0.97);
 
    transition:
        opacity 0.38s ease,
        transform 0.38s ease;
 
    scrollbar-width: thin;
    scrollbar-color: rgba(231, 178, 0, 0.45) transparent;
}
 
.mp-welcome-overlay.is-open .mp-card {
    opacity: 1;
    transform: translateY(0) scale(1);
}
 
.mp-card::-webkit-scrollbar {
    width: 6px;
}
 
.mp-card::-webkit-scrollbar-track {
    background: transparent;
}
 
.mp-card::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(231, 178, 0, 0.42);
}
 
 
/* =========================================================
   UŽDARYMO MYGTUKAS
========================================================= */
 
.mp-close-button {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 20;
 
    width: 44px;
    height: 44px;
 
    padding: 0;
 
    border: 1px solid rgba(70, 61, 42, 0.1);
    border-radius: 50%;
 
    background: rgba(255, 255, 255, 0.82);
 
    cursor: pointer;
 
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
 
    transition:
        transform 0.2s ease,
        background-color 0.2s ease;
}
 
.mp-close-button span::before,
.mp-close-button span::after {
    content: "";
 
    position: absolute;
    top: 50%;
    left: 50%;
 
    width: 20px;
    height: 2px;
 
    border-radius: 999px;
 
    background: #665c4c;
}
 
.mp-close-button span::before {
    transform: translate(-50%, -50%) rotate(45deg);
}
 
.mp-close-button span::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}
 
.mp-close-button:hover {
    transform: rotate(5deg);
    background: #ffffff;
}
 
.mp-close-button:focus-visible {
    outline: 3px solid rgba(231, 178, 0, 0.3);
    outline-offset: 3px;
}
 
/* Kadence button focus stilius neturi nudažyti uždarymo mygtuko. */
button#mp-close-button,
button#mp-close-button:hover,
button#mp-close-button:focus,
button#mp-close-button:focus-visible,
button#mp-close-button:active {
    background: rgba(255, 255, 255, 0.82) !important;
    background-color: rgba(255, 255, 255, 0.82) !important;
    color: #665c4c !important;
}
 
button#mp-close-button:hover {
    background: #ffffff !important;
    background-color: #ffffff !important;
}
 
 
 
/* =========================================================
   PROGRESO JUOSTOS
========================================================= */
 
.mp-progress {
    position: relative;
    z-index: 10;
 
    display: flex;
    justify-content: center;
    gap: 10px;
 
    padding: 34px 76px 0;
}
 
.mp-progress span {
    width: 38px;
    height: 5px;
 
    border-radius: 999px;
 
    background: #eee4c9;
 
    transition:
        background-color 0.3s ease,
        transform 0.3s ease;
}
 
.mp-progress span.is-active {
    background: var(--mp-gold);
    transform: scaleX(1.08);
}
 
 
/* =========================================================
   SKAIDRIŲ SISTEMA
========================================================= */
 
.mp-slides {
    position: relative;
}
 
.mp-slide {
    display: none;
}
 
.mp-slide.is-active {
    display: block;
    animation: mpSlideIn 0.42s ease both;
}
 
.mp-slide.is-leaving {
    animation: mpSlideOut 0.22s ease both;
}
 
@keyframes mpSlideIn {
    from {
        opacity: 0;
        transform: translateX(22px);
    }
 
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
 
@keyframes mpSlideOut {
    from {
        opacity: 1;
        transform: translateX(0);
    }
 
    to {
        opacity: 0;
        transform: translateX(-16px);
    }
}
 
 
/* =========================================================
   BENDRAS TURINYS
========================================================= */
 
.mp-content {
    position: relative;
    z-index: 2;
 
    padding: 40px 58px 58px;
 
    text-align: center;
}
 
.mp-brand {
    margin-bottom: 28px;
}
 
.mp-logo {
    margin-bottom: 10px;
 
    color: var(--mp-text);
 
    font-size: clamp(40px, 6vw, 54px);
    font-weight: 750;
    line-height: 1.04;
    letter-spacing: -1.8px;
}
 
.mp-subtitle {
    color: #987f46;
 
    font-size: 12px;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 1.7px;
    text-transform: uppercase;
}
 
.mp-content h2 {
    margin: 0 0 17px;
 
    color: var(--mp-text);
 
    font-size: clamp(31px, 5vw, 43px);
    font-weight: 650;
    line-height: 1.14;
}
 
.mp-intro {
    max-width: 610px;
 
    margin: 0 auto;
 
    color: var(--mp-text-soft);
 
    font-size: 17px;
    line-height: 1.68;
}
 
.mp-features-heading {
    margin-top: 31px;
    margin-bottom: 17px;
 
    color: #41392e;
 
    font-size: 16px;
    font-weight: 750;
}
 
 
/* =========================================================
   PIRMOS KORTELĖS INFORMACINĖS KORTELĖS
========================================================= */
 
.mp-feature-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 13px;
}
 
.mp-feature-card {
    display: flex;
    flex-direction: column;
    align-items: center;
 
    min-width: 0;
    min-height: 160px;
 
    padding: 18px 12px 16px;
 
    border: 1px solid rgba(231, 178, 0, 0.15);
    border-radius: 21px;
 
    background: rgba(255, 255, 255, 0.69);
    color: var(--mp-text);
 
    box-shadow:
        0 8px 24px rgba(88, 66, 17, 0.06);
 
    text-decoration: none;
 
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
 
    transition:
        transform 0.24s ease,
        border-color 0.24s ease,
        background-color 0.24s ease,
        box-shadow 0.24s ease;
}
 
.mp-feature-card:hover {
    transform: translateY(-5px);
 
    border-color: rgba(231, 178, 0, 0.34);
    background: rgba(255, 252, 240, 0.98);
 
    box-shadow:
        0 14px 30px rgba(88, 66, 17, 0.11);
}
 
.mp-feature-card:focus-visible,
.mp-topic-card:focus-visible {
    outline: 3px solid rgba(231, 178, 0, 0.28);
    outline-offset: 3px;
}
 
 
/* =========================================================
   PIRMOS KORTELĖS IKONOS
========================================================= */
 
.mp-feature-icon {
    display: block;
 
    width: 62px;
    height: 62px;
 
    margin-bottom: 12px;
 
    border-radius: 50%;
 
    background-color: #594b2d;
 
    box-shadow:
        0 0 0 13px rgba(255, 234, 165, 0.56);
 
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
 
    -webkit-mask-position: center;
    mask-position: center;
 
    -webkit-mask-size: 31px 31px;
    mask-size: 31px 31px;
}
 
.mp-icon-articles {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 5.5A3.5 3.5 0 0 1 6 2h4a2 2 0 0 1 2 2v17a3 3 0 0 0-3-3H2.5Z'/%3E%3Cpath d='M21.5 5.5A3.5 3.5 0 0 0 18 2h-4a2 2 0 0 0-2 2v17a3 3 0 0 1 3-3h6.5Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 5.5A3.5 3.5 0 0 1 6 2h4a2 2 0 0 1 2 2v17a3 3 0 0 0-3-3H2.5Z'/%3E%3Cpath d='M21.5 5.5A3.5 3.5 0 0 0 18 2h-4a2 2 0 0 0-2 2v17a3 3 0 0 1 3-3h6.5Z'/%3E%3C/svg%3E");
}
 
.mp-icon-tests {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2'/%3E%3Cpath d='m8 8 1.4 1.4L12 7'/%3E%3Cpath d='M14 9h3'/%3E%3Cpath d='m8 14 1.4 1.4L12 13'/%3E%3Cpath d='M14 15h3'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2'/%3E%3Cpath d='m8 8 1.4 1.4L12 7'/%3E%3Cpath d='M14 9h3'/%3E%3Cpath d='m8 14 1.4 1.4L12 13'/%3E%3Cpath d='M14 15h3'/%3E%3C/svg%3E");
}
 
.mp-icon-courses {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 10 9-5 9 5-9 5Z'/%3E%3Cpath d='m7 12.5 5 2.8 5-2.8V17l-5 2.8L7 17Z'/%3E%3Cpath d='M21 10v6'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 10 9-5 9 5-9 5Z'/%3E%3Cpath d='m7 12.5 5 2.8 5-2.8V17l-5 2.8L7 17Z'/%3E%3Cpath d='M21 10v6'/%3E%3C/svg%3E");
}
 
.mp-icon-consultation {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 14a4 4 0 0 1-4 4H9l-5 3v-7a4 4 0 0 1-1-2.7V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4Z'/%3E%3Cpath d='M8 9h8'/%3E%3Cpath d='M8 13h5'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 14a4 4 0 0 1-4 4H9l-5 3v-7a4 4 0 0 1-1-2.7V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4Z'/%3E%3Cpath d='M8 9h8'/%3E%3Cpath d='M8 13h5'/%3E%3C/svg%3E");
}
 
.mp-feature-title {
    margin-top: 3px;
 
    color: #3d362c;
 
    font-size: 15px;
    font-weight: 750;
    line-height: 1.25;
}
 
.mp-feature-text {
    max-width: 145px;
 
    margin-top: 7px;
 
    color: #807566;
 
    font-size: 12px;
    font-weight: 450;
    line-height: 1.42;
}
 
 
/* =========================================================
   ANTROS KORTELĖS ANTRAŠTĖ
========================================================= */
 
.mp-topics-content {
    padding-top: 34px;
}
 
.mp-section-badge {
    display: inline-flex;
    align-items: center;
    gap: 0;
 
    margin-bottom: 20px;
    padding: 9px 15px;
 
    border: 1px solid rgba(231, 178, 0, 0.19);
    border-radius: 999px;
 
    background: rgba(255, 247, 215, 0.75);
    color: #8b7137;
 
    font-size: 12px;
    font-weight: 750;
    line-height: 1;
    letter-spacing: 0.35px;
    text-transform: uppercase;
}
 
.mp-section-badge-icon {
    color: var(--mp-gold);
    font-size: 14px;
}
 
.mp-topics-intro {
    max-width: 650px;
}
 
 
/* =========================================================
   ANTROS KORTELĖS TEMŲ TINKLELIS
========================================================= */
 
.mp-topic-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
 
    margin-top: 30px;
}
 
.mp-topic-card {
    display: flex;
    align-items: center;
    gap: 17px;
 
    min-width: 0;
    min-height: 112px;
 
    padding: 18px;
 
    border: 1px solid rgba(231, 178, 0, 0.14);
    border-radius: 21px;
 
    background: rgba(255, 255, 255, 0.72);
 
    box-shadow:
        0 8px 24px rgba(88, 66, 17, 0.055);
 
    text-align: left;
 
    transition:
        transform 0.24s ease,
        border-color 0.24s ease,
        background-color 0.24s ease,
        box-shadow 0.24s ease;
}
 
.mp-topic-card:hover {
    transform: translateY(-4px);
 
    border-color: rgba(231, 178, 0, 0.32);
    background: rgba(255, 252, 241, 0.97);
 
    box-shadow:
        0 13px 28px rgba(88, 66, 17, 0.1);
}
 
.mp-topic-icon {
    flex: 0 0 auto;
 
    display: block;
 
    width: 54px;
    height: 54px;
 
    border-radius: 17px;
 
    background-color: #665432;
 
    box-shadow:
        0 0 0 9px rgba(255, 235, 171, 0.5);
 
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
 
    -webkit-mask-position: center;
    mask-position: center;
 
    -webkit-mask-size: 28px 28px;
    mask-size: 28px 28px;
}
 
.mp-topic-copy {
    min-width: 0;
}
 
.mp-topic-copy h3 {
    margin: 0 0 6px;
 
    color: #3b342b;
 
    font-size: 15px;
    font-weight: 750;
    line-height: 1.3;
}
 
.mp-topic-copy p {
    margin: 0;
 
    color: #81776a;
 
    font-size: 12px;
    line-height: 1.45;
}
 
 
/* =========================================================
   ANTROS KORTELĖS SVG IKONOS
========================================================= */
 
.mp-icon-eating {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0'/%3E%3Cpath d='M8 7c0-1 .7-2 2-3'/%3E%3Cpath d='M12 7c0-1 .7-2 2-3'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0'/%3E%3Cpath d='M8 7c0-1 .7-2 2-3'/%3E%3Cpath d='M12 7c0-1 .7-2 2-3'/%3E%3C/svg%3E");
}
 
.mp-icon-anxiety {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 4.5A7.5 7.5 0 1 0 17 17v-3l2-2-2-2V8a7.5 7.5 0 0 0-7.5-3.5Z'/%3E%3Cpath d='M9 10h.01'/%3E%3Cpath d='M13 10h.01'/%3E%3Cpath d='M9 14c1.5-1 3.5-1 5 0'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 4.5A7.5 7.5 0 1 0 17 17v-3l2-2-2-2V8a7.5 7.5 0 0 0-7.5-3.5Z'/%3E%3Cpath d='M9 10h.01'/%3E%3Cpath d='M13 10h.01'/%3E%3Cpath d='M9 14c1.5-1 3.5-1 5 0'/%3E%3C/svg%3E");
}
 
.mp-icon-emigration {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='M12 3a14 14 0 0 1 0 18'/%3E%3Cpath d='M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='M12 3a14 14 0 0 1 0 18'/%3E%3Cpath d='M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E");
}
 
.mp-icon-relationships {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1.1-1.1a5.5 5.5 0 0 0-7.8 7.8L12 21l8.8-8.6a5.5 5.5 0 0 0 0-7.8Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1.1-1.1a5.5 5.5 0 0 0-7.8 7.8L12 21l8.8-8.6a5.5 5.5 0 0 0 0-7.8Z'/%3E%3C/svg%3E");
}
 
.mp-icon-selfworth {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3Cpath d='m16.5 4.5.8.8 1.7-1.7'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3Cpath d='m16.5 4.5.8.8 1.7-1.7'/%3E%3C/svg%3E");
}
 
.mp-icon-growth {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22V12'/%3E%3Cpath d='M12 12C7 12 4 9 4 4c5 0 8 3 8 8Z'/%3E%3Cpath d='M12 16c4 0 7-2.5 7-7-4.5 0-7 2.5-7 7Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22V12'/%3E%3Cpath d='M12 12C7 12 4 9 4 4c5 0 8 3 8 8Z'/%3E%3Cpath d='M12 16c4 0 7-2.5 7-7-4.5 0-7 2.5-7 7Z'/%3E%3C/svg%3E");
}
 
 
/* =========================================================
   MYGTUKAI
========================================================= */
 
.mp-primary-button,
.mp-secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
 
    min-width: 190px;
 
    padding: 17px 30px;
 
    border-radius: 999px;
 
    font-family: inherit;
    font-size: 16px;
    font-weight: 750;
    line-height: 1;
 
    cursor: pointer;
 
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background-color 0.25s ease;
}
 
.mp-primary-button {
    margin-top: 30px;
 
    border: 0;
 
    background:
        linear-gradient(
            135deg,
            #edba00 0%,
            #e7b200 100%
        ) !important;
 
    color: #ffffff !important;
 
    box-shadow:
        0 11px 26px rgba(231, 178, 0, 0.27);
}
 
.mp-primary-button:hover {
    transform: translateY(-3px);
 
    box-shadow:
        0 15px 31px rgba(231, 178, 0, 0.34);
}
 
.mp-secondary-button {
    border: 1px solid rgba(93, 77, 43, 0.15);
 
    background: rgba(255, 255, 255, 0.75) !important;
    color: #615744 !important;
 
    box-shadow:
        0 7px 18px rgba(75, 59, 25, 0.06);
}
 
.mp-secondary-button:hover {
    transform: translateY(-2px);
 
    background: #ffffff !important;
 
    box-shadow:
        0 10px 22px rgba(75, 59, 25, 0.1);
}
 
.mp-primary-button:focus-visible,
.mp-secondary-button:focus-visible {
    outline: 3px solid rgba(231, 178, 0, 0.3);
    outline-offset: 4px;
}
 
.mp-button-arrow,
.mp-back-arrow {
    font-size: 21px;
    line-height: 1;
 
    transition: transform 0.25s ease;
}
 
.mp-primary-button:hover .mp-button-arrow {
    transform: translateX(4px);
}
 
.mp-secondary-button:hover .mp-back-arrow {
    transform: translateX(-4px);
}
 
.mp-navigation {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
 
    margin-top: 28px;
}
 
.mp-navigation .mp-primary-button {
    margin-top: 0;
}
 
 
/* =========================================================
   PLANŠETĖ
========================================================= */
 
@media (max-width: 780px) {
    .mp-feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
 
    .mp-feature-card {
        min-height: 145px;
    }
 
    .mp-topic-grid {
        grid-template-columns: 1fr;
    }
}
 
 
/* =========================================================
   TELEFONAS
========================================================= */
 
@media (max-width: 520px) {
    .mp-open-button {
        right: 15px;
        bottom: 15px;
 
        padding: 11px 15px;
 
        font-size: 14px;
    }
 
    .mp-welcome-overlay {
        align-items: flex-end;
        padding: 10px;
    }
 
    .mp-card {
        max-height: calc(100dvh - 20px);
        border-radius: 27px;
    }
 
    .mp-progress {
        gap: 7px;
        padding: 27px 54px 0;
    }
 
    .mp-progress span {
        width: 24px;
        height: 4px;
    }
 
    .mp-content {
        padding: 36px 20px 36px;
    }
 
    .mp-brand {
        margin-bottom: 25px;
    }
 
    .mp-logo {
        font-size: 39px;
    }
 
    .mp-subtitle {
        font-size: 10px;
        letter-spacing: 1.2px;
    }
 
    .mp-content h2 {
        margin-bottom: 14px;
        font-size: 31px;
    }
 
    .mp-intro {
        font-size: 15px;
        line-height: 1.62;
    }
 
    .mp-features-heading {
        margin-top: 26px;
        margin-bottom: 14px;
        font-size: 15px;
    }
 
    .mp-feature-grid {
        gap: 10px;
    }
 
    .mp-feature-card {
        min-height: 138px;
 
        padding: 16px 8px 14px;
 
        border-radius: 18px;
    }
 
    .mp-feature-icon {
        width: 50px;
        height: 50px;
 
        margin-bottom: 10px;
 
        box-shadow:
            0 0 0 10px rgba(255, 234, 165, 0.55);
 
        -webkit-mask-size: 26px 26px;
        mask-size: 26px 26px;
    }
 
    .mp-feature-title {
        font-size: 13px;
    }
 
    .mp-feature-text {
        max-width: 125px;
 
        font-size: 11px;
        line-height: 1.35;
    }
 
    .mp-primary-button {
        width: 100%;
        min-width: 0;
 
        margin-top: 26px;
    }
 
    .mp-close-button {
        top: 14px;
        right: 14px;
 
        width: 39px;
        height: 39px;
    }
 
    .mp-topics-content {
        padding-top: 32px;
    }
 
    .mp-section-badge {
        max-width: calc(100% - 60px);
 
        margin-bottom: 17px;
        padding: 8px 12px;
 
        font-size: 10px;
        line-height: 1.25;
    }
 
    .mp-topic-grid {
        gap: 10px;
        margin-top: 24px;
    }
 
    .mp-topic-card {
        gap: 14px;
 
        min-height: 100px;
 
        padding: 15px;
 
        border-radius: 18px;
    }
 
    .mp-topic-icon {
        width: 46px;
        height: 46px;
 
        border-radius: 14px;
 
        box-shadow:
            0 0 0 7px rgba(255, 235, 171, 0.5);
 
        -webkit-mask-size: 24px 24px;
        mask-size: 24px 24px;
    }
 
    .mp-topic-copy h3 {
        font-size: 13px;
    }
 
    .mp-topic-copy p {
        font-size: 11px;
    }
 
    .mp-navigation {
        gap: 9px;
        margin-top: 24px;
    }
 
    .mp-navigation .mp-primary-button,
    .mp-navigation .mp-secondary-button {
        width: 50%;
        min-width: 0;
 
        padding: 15px 14px;
 
        font-size: 14px;
    }
}
 
 
/* =========================================================
   LABAI MAŽAS TELEFONAS
========================================================= */
 
@media (max-width: 360px) {
    .mp-content {
        padding-right: 16px;
        padding-left: 16px;
    }
 
    .mp-topic-card {
        padding-right: 12px;
        padding-left: 12px;
    }
 
    .mp-topic-icon {
        width: 42px;
        height: 42px;
    }
}
 
 
/* =========================================================
   SUMAŽINTOS ANIMACIJOS
========================================================= */
 
@media (prefers-reduced-motion: reduce) {
    .mp-open-button,
    .mp-welcome-overlay,
    .mp-card,
    .mp-close-button,
    .mp-progress span,
    .mp-slide,
    .mp-feature-card,
    .mp-topic-card,
    .mp-primary-button,
    .mp-secondary-button,
    .mp-button-arrow,
    .mp-back-arrow {
        animation: none;
        transition: none;
    }
}
 
/* =========================================================
   TREČIA KORTELĖ — KAIP NAUDOTIS MARYNAPSY
========================================================= */
.mp-guide-content {
    padding-top: 34px;
}
 
.mp-guide-intro {
    max-width: 660px;
}
 
.mp-guide-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 30px;
}
 
.mp-guide-card {
    position: relative;
    min-width: 0;
    min-height: 222px;
    padding: 25px 18px 21px;
    border: 1px solid rgba(231, 178, 0, 0.15);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 8px 24px rgba(88, 66, 17, 0.055);
    text-align: center;
    transition:
        transform 0.24s ease,
        border-color 0.24s ease,
        background-color 0.24s ease,
        box-shadow 0.24s ease;
}
 
.mp-guide-card:hover {
    transform: translateY(-5px);
    border-color: rgba(231, 178, 0, 0.34);
    background: rgba(255, 252, 241, 0.98);
    box-shadow: 0 14px 30px rgba(88, 66, 17, 0.1);
}
 
.mp-guide-number {
    position: absolute;
    top: 14px;
    right: 16px;
    color: rgba(231, 178, 0, 0.36);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.8px;
}
 
.mp-guide-icon {
    display: block;
    width: 58px;
    height: 58px;
    margin: 6px auto 17px;
    border-radius: 18px;
    background-color: #665432;
    box-shadow: 0 0 0 10px rgba(255, 235, 171, 0.5);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 29px 29px;
    mask-size: 29px 29px;
}
 
.mp-icon-compass {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m15.5 8.5-2.1 4.9-4.9 2.1 2.1-4.9Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m15.5 8.5-2.1 4.9-4.9 2.1 2.1-4.9Z'/%3E%3C/svg%3E");
}
 
.mp-icon-toolbox {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='7' width='18' height='13' rx='2'/%3E%3Cpath d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='M10 12v2h4v-2'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='7' width='18' height='13' rx='2'/%3E%3Cpath d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='M10 12v2h4v-2'/%3E%3C/svg%3E");
}
 
.mp-icon-support {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13a8 8 0 0 1 16 0'/%3E%3Cpath d='M4 13v4a2 2 0 0 0 2 2h2v-7H6a2 2 0 0 0-2 2Z'/%3E%3Cpath d='M20 13v4a2 2 0 0 1-2 2h-2v-7h2a2 2 0 0 1 2 2Z'/%3E%3Cpath d='M16 19c0 1.1-.9 2-2 2h-2'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13a8 8 0 0 1 16 0'/%3E%3Cpath d='M4 13v4a2 2 0 0 0 2 2h2v-7H6a2 2 0 0 0-2 2Z'/%3E%3Cpath d='M20 13v4a2 2 0 0 1-2 2h-2v-7h2a2 2 0 0 1 2 2Z'/%3E%3Cpath d='M16 19c0 1.1-.9 2-2 2h-2'/%3E%3C/svg%3E");
}
 
.mp-guide-copy h3 {
    margin: 0 0 8px;
    color: #3b342b;
    font-size: 15px;
    font-weight: 750;
    line-height: 1.35;
}
 
.mp-guide-copy p {
    margin: 0;
    color: #81776a;
    font-size: 12px;
    line-height: 1.5;
}
 
.mp-guide-note {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    max-width: 650px;
    margin-top: 22px;
    padding: 12px 18px;
    border: 1px solid rgba(231, 178, 0, 0.17);
    border-radius: 999px;
    background: rgba(255, 247, 215, 0.72);
    color: #786438;
    font-size: 13px;
    line-height: 1.4;
}
 
.mp-guide-note-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--mp-gold);
    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
}
 
@media (max-width: 780px) {
    .mp-guide-grid {
        grid-template-columns: 1fr;
    }
 
    .mp-guide-card {
        display: flex;
        align-items: center;
        gap: 18px;
        min-height: 116px;
        padding: 19px 20px;
        text-align: left;
    }
 
    .mp-guide-icon {
        flex: 0 0 auto;
        width: 52px;
        height: 52px;
        margin: 0;
        border-radius: 16px;
        -webkit-mask-size: 26px 26px;
        mask-size: 26px 26px;
    }
 
    .mp-guide-number {
        top: 12px;
        right: 14px;
    }
}
 
@media (max-width: 520px) {
    .mp-guide-content {
        padding-top: 32px;
    }
 
    .mp-guide-grid {
        gap: 10px;
        margin-top: 24px;
    }
 
    .mp-guide-card {
        gap: 14px;
        min-height: 104px;
        padding: 16px 15px;
        border-radius: 18px;
    }
 
    .mp-guide-icon {
        width: 46px;
        height: 46px;
        border-radius: 14px;
        box-shadow: 0 0 0 7px rgba(255, 235, 171, 0.5);
        -webkit-mask-size: 23px 23px;
        mask-size: 23px 23px;
    }
 
    .mp-guide-copy h3 {
        padding-right: 22px;
        font-size: 13px;
    }
 
    .mp-guide-copy p {
        font-size: 11px;
        line-height: 1.42;
    }
 
    .mp-guide-note {
        width: 100%;
        margin-top: 18px;
        padding: 11px 14px;
        border-radius: 18px;
        font-size: 11px;
        text-align: left;
    }
}
 
/* =========================================================
   KETVIRTA KORTELĖ — KASDIENIAI ĮRANKIAI
========================================================= */
.mp-tools-content {
    padding-top: 34px;
}
 
.mp-tools-intro {
    max-width: 670px;
}
 
.mp-tools-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 28px;
}
 
.mp-tool-card {
    display: flex;
    align-items: center;
    gap: 17px;
    min-width: 0;
    min-height: 132px;
    padding: 19px;
    border: 1px solid rgba(231, 178, 0, 0.15);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 8px 24px rgba(88, 66, 17, 0.055);
    text-align: left;
    transition:
        transform 0.24s ease,
        border-color 0.24s ease,
        background-color 0.24s ease,
        box-shadow 0.24s ease;
}
 
.mp-tool-card:hover {
    transform: translateY(-4px);
    border-color: rgba(231, 178, 0, 0.33);
    background: rgba(255, 252, 241, 0.98);
    box-shadow: 0 13px 28px rgba(88, 66, 17, 0.1);
}
 
.mp-tool-card-sos {
    border-color: rgba(82, 151, 112, 0.25);
    background: rgba(244, 252, 247, 0.82);
}
 
.mp-tool-card-sos:hover {
    border-color: rgba(82, 151, 112, 0.45);
    background: rgba(240, 251, 245, 0.98);
}
 
.mp-tool-icon {
    flex: 0 0 auto;
    display: block;
    width: 56px;
    height: 56px;
    border-radius: 18px;
    background-color: #665432;
    box-shadow: 0 0 0 9px rgba(255, 235, 171, 0.5);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 29px 29px;
    mask-size: 29px 29px;
}
 
.mp-tool-card-sos .mp-tool-icon {
    background-color: #3f7658;
    box-shadow: 0 0 0 9px rgba(184, 222, 197, 0.48);
}
 
.mp-tool-copy {
    min-width: 0;
}
 
.mp-tool-copy h3 {
    margin: 0 0 7px;
    color: #3b342b;
    font-size: 15px;
    font-weight: 750;
    line-height: 1.3;
}
 
.mp-tool-copy p {
    margin: 0;
    color: #81776a;
    font-size: 12px;
    line-height: 1.48;
}
 
.mp-icon-espresso {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8h12v5a5 5 0 0 1-5 5H9a5 5 0 0 1-5-5Z'/%3E%3Cpath d='M16 10h2a3 3 0 0 1 0 6h-2'/%3E%3Cpath d='M7 3v2'/%3E%3Cpath d='M11 3v2'/%3E%3Cpath d='M3 21h16'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8h12v5a5 5 0 0 1-5 5H9a5 5 0 0 1-5-5Z'/%3E%3Cpath d='M16 10h2a3 3 0 0 1 0 6h-2'/%3E%3Cpath d='M7 3v2'/%3E%3Cpath d='M11 3v2'/%3E%3Cpath d='M3 21h16'/%3E%3C/svg%3E");
}
 
.mp-icon-video {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='14' height='14' rx='2'/%3E%3Cpath d='m10 9 4 3-4 3Z'/%3E%3Cpath d='m17 10 4-2v8l-4-2'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='14' height='14' rx='2'/%3E%3Cpath d='m10 9 4 3-4 3Z'/%3E%3Cpath d='m17 10 4-2v8l-4-2'/%3E%3C/svg%3E");
}
 
.mp-icon-sos {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 2.8 19h18.4Z'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 16h.01'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 2.8 19h18.4Z'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 16h.01'/%3E%3C/svg%3E");
}
 
.mp-icon-question {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 14a4 4 0 0 1-4 4H9l-5 3v-7a4 4 0 0 1-1-2.7V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4Z'/%3E%3Cpath d='M9.5 9a2.7 2.7 0 0 1 5.1 1.2c0 2-2.6 2.2-2.6 4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 14a4 4 0 0 1-4 4H9l-5 3v-7a4 4 0 0 1-1-2.7V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4Z'/%3E%3Cpath d='M9.5 9a2.7 2.7 0 0 1 5.1 1.2c0 2-2.6 2.2-2.6 4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}
 
.mp-tools-note {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    max-width: 680px;
    margin-top: 21px;
    padding: 12px 18px;
    border: 1px solid rgba(231, 178, 0, 0.17);
    border-radius: 999px;
    background: rgba(255, 247, 215, 0.72);
    color: #786438;
    font-size: 13px;
    line-height: 1.4;
}
 
.mp-tools-note-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--mp-gold);
    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
}
 
@media (max-width: 780px) {
    .mp-tools-grid {
        grid-template-columns: 1fr;
    }
}
 
@media (max-width: 520px) {
    .mp-tools-content {
        padding-top: 32px;
    }
 
    .mp-tools-grid {
        gap: 10px;
        margin-top: 24px;
    }
 
    .mp-tool-card {
        gap: 14px;
        min-height: 108px;
        padding: 16px 15px;
        border-radius: 18px;
    }
 
    .mp-tool-icon {
        width: 46px;
        height: 46px;
        border-radius: 14px;
        box-shadow: 0 0 0 7px rgba(255, 235, 171, 0.5);
        -webkit-mask-size: 24px 24px;
        mask-size: 24px 24px;
    }
 
    .mp-tool-card-sos .mp-tool-icon {
        box-shadow: 0 0 0 7px rgba(184, 222, 197, 0.48);
    }
 
    .mp-tool-copy h3 {
        font-size: 13px;
    }
 
    .mp-tool-copy p {
        font-size: 11px;
        line-height: 1.42;
    }
 
    .mp-tools-note {
        width: 100%;
        margin-top: 18px;
        padding: 11px 14px;
        border-radius: 18px;
        font-size: 11px;
        text-align: left;
    }
}
 
/* =========================================================
 PENKTA KORTELĖ — APIE MARYNĄ
========================================================= */
.mp-about-content {
 padding-top: 28px;
}
.mp-about-hero {
 display: grid;
 grid-template-columns: 205px minmax(0, 1fr);
 align-items: center;
 gap: 34px;
 max-width: 730px;
 margin: 0 auto;
 padding: 22px 26px;
 border: 1px solid rgba(231, 178, 0, 0.13);
 border-radius: 26px;
 background: linear-gradient(135deg, rgba(255,255,255,.86), rgba(255,249,231,.62));
 box-shadow: 0 12px 34px rgba(82, 63, 21, 0.07);
 text-align: left;
}
.mp-about-photo-wrap {
 width: 190px;
 height: 190px;
 padding: 5px;
 border: 1px solid rgba(201, 153, 0, 0.62);
 border-radius: 50%;
 background: rgba(255, 255, 255, 0.94);
 box-shadow: 0 16px 36px rgba(81, 61, 19, 0.16);
}
.mp-about-photo {
 display: block;
 width: 100%;
 height: 100%;
 border-radius: 50%;
 object-fit: cover;
 object-position: center;
}
.mp-about-hero-copy {
 min-width: 0;
}
.mp-about-title {
 margin: 0 !important;
 color: #51483d !important;
 font-family: "Cormorant Garamond", Georgia, serif;
 font-size: clamp(28px, 4vw, 38px) !important;
 font-weight: 600 !important;
 line-height: 1.08 !important;
 letter-spacing: -0.35px !important;
 text-align: left !important;
}
.mp-about-role {
 margin-top: 16px;
 color: #8b7650;
 font-size: 14px;
 font-weight: 600;
 line-height: 1.35;
 letter-spacing: 0;
 text-transform: none;
}
.mp-about-lead {
 max-width: 470px;
 margin: 22px 0 0;
 color: #62584d;
 font-size: 16px;
 font-weight: 500;
 line-height: 1.60;
}
.mp-about-grid {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 14px;
 margin-top: 18px;
 text-align: left;
}
.mp-about-panel {
 padding: 19px 20px;
 border: 1px solid rgba(231, 178, 0, 0.15);
 border-radius: 21px;
 background: rgba(255, 255, 255, 0.76);
 box-shadow: 0 8px 24px rgba(88, 66, 17, 0.055);
}
.mp-about-panel h3 {
 display: flex;
 align-items: center;
 gap: 9px;
 margin: 0 0 14px;
 color: #4d4438;
 font-size: 15px;
 font-weight: 750;
 line-height: 1.35;
}
.mp-about-panel-mark {
 display: grid;
 place-items: center;
 width: 29px;
 height: 29px;
 flex: 0 0 29px;
 border-radius: 10px;
 background: var(--mp-gold-pale);
 color: #b88b00;
 font-size: 14px;
}
.mp-about-panel ul {
 display: grid;
 gap: 9px;
 margin: 0;
 padding: 0;
 list-style: none;
}
.mp-about-panel li {
 display: flex;
 align-items: center;
 gap: 10px;
 min-height: 27px;
 color: #71675d;
 font-size: 13px;
 line-height: 1.35;
}
.mp-about-list-icon {
 position: relative;
 display: grid;
 place-items: center;
 width: 25px;
 height: 25px;
 flex: 0 0 25px;
 border-radius: 8px;
 background: rgba(255, 243, 197, 0.72);
 color: #a77d00;
}
.mp-about-list-icon::before {
 font-size: 14px;
 line-height: 1;
}
.mp-about-icon-eating::before { content: "◌"; }
.mp-about-icon-anxiety::before { content: "∿"; }
.mp-about-icon-relationships::before { content: "∞"; }
.mp-about-icon-selfworth::before { content: "◇"; }
.mp-about-icon-emigration::before { content: "⌂"; }
.mp-about-icon-online::before { content: "⌁"; }
.mp-about-icon-ukrainian::before { content: "У"; font-size: 11px; font-weight: 800; }
.mp-about-icon-russian::before { content: "Р"; font-size: 11px; font-weight: 800; }
.mp-about-icon-world::before { content: "◎"; }
.mp-about-quote {
 margin: 20px auto 0;
 color: #6f5c33;
 font-family: "Cormorant Garamond", Georgia, serif;
 font-size: 20px;
 font-weight: 600;
 line-height: 1.4;
 text-align: center;
}
.mp-about-navigation {
 margin-top: 18px;
}
.mp-about-slide.is-active .mp-about-hero,
.mp-about-slide.is-active .mp-about-grid,
.mp-about-slide.is-active .mp-about-quote {
 animation: mpAboutReveal 0.48s ease both;
}
.mp-about-slide.is-active .mp-about-grid { animation-delay: 0.14s; }
.mp-about-slide.is-active .mp-about-quote { animation-delay: 0.24s; }
@keyframes mpAboutReveal {
 from { opacity: 0; transform: translateY(10px); }
 to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 780px) {
 .mp-about-hero {
  grid-template-columns: 165px minmax(0, 1fr);
  gap: 24px;
  padding: 20px;
 }
 .mp-about-photo-wrap { width: 155px; height: 155px; }
 .mp-about-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
 .mp-about-content { padding-top: 28px; }
 .mp-about-hero {
  grid-template-columns: 1fr;
  gap: 18px;
  padding: 20px 17px;
  text-align: center;
 }
 .mp-about-photo-wrap {
  width: 164px;
  height: 164px;
  margin: 0 auto;
 }
 .mp-about-title {
  font-size: 30px !important;
  text-align: center !important;
 }
 .mp-about-role { font-size: 14px; }
 .mp-about-lead {
  margin: 16px auto 0;
  font-size: 15px;
  line-height: 1.52;
 }
 .mp-about-grid { gap: 10px; margin-top: 14px; }
 .mp-about-panel { padding: 17px 16px; border-radius: 18px; }
 .mp-about-panel h3 { font-size: 15px; }
 .mp-about-panel li { font-size: 14px; }
 .mp-about-quote { font-size: 20px; }
 .mp-about-navigation .mp-secondary-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
 .mp-about-slide.is-active .mp-about-hero,
 .mp-about-slide.is-active .mp-about-grid,
 .mp-about-slide.is-active .mp-about-quote { animation: none; }
}
 
/* =========================================================
 ŠEŠTA KORTELĖ — UŽBAIGIMAS
========================================================= */
.mp-finish-content {
 padding-top: 28px;
}
.mp-finish-image-wrap {
 max-width: 690px;
 height: 280px;
 margin: 0 auto 28px;
 overflow: hidden;
 border: 1px solid rgba(231, 178, 0, 0.16);
 border-radius: 25px;
 background: #f8efe1;
 box-shadow: 0 14px 38px rgba(88, 66, 17, 0.10);
}
.mp-finish-image {
 display: block;
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: center 48%;
}
.mp-content .mp-finish-title {
 max-width: 650px;
 margin: 0 auto 18px;
 color: #4c4338;
 font-family: "Cormorant Garamond", Georgia, serif;
 font-size: clamp(30px, 4.7vw, 42px);
 font-weight: 600;
 line-height: 1.14;
 letter-spacing: -0.45px;
}
.mp-finish-quote {
 max-width: 590px;
 margin: 0 auto;
 color: #90743e;
 font-family: "Cormorant Garamond", Georgia, serif;
 font-size: 21px;
 font-style: italic;
 font-weight: 600;
 line-height: 1.45;
}
.mp-finish-text {
 max-width: 630px;
 margin: 18px auto 0;
 color: #6b6155;
 font-size: 16px;
 line-height: 1.62;
}
.mp-finish-navigation {
 margin-top: 26px;
}
.mp-finish-button {
 margin-top: 0;
}
.mp-finish-slide.is-active .mp-finish-image-wrap,
.mp-finish-slide.is-active .mp-finish-title,
.mp-finish-slide.is-active .mp-finish-quote,
.mp-finish-slide.is-active .mp-finish-text {
 animation: mpFinishReveal 0.48s ease both;
}
.mp-finish-slide.is-active .mp-finish-title { animation-delay: 0.10s; }
.mp-finish-slide.is-active .mp-finish-quote { animation-delay: 0.18s; }
.mp-finish-slide.is-active .mp-finish-text { animation-delay: 0.24s; }
@keyframes mpFinishReveal {
 from { opacity: 0; transform: translateY(10px); }
 to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 520px) {
 .mp-finish-content { padding-top: 30px; }
 .mp-finish-image-wrap {
  height: 205px;
  margin-bottom: 24px;
  border-radius: 20px;
 }
 .mp-content .mp-finish-title {
  margin-bottom: 15px;
  font-size: 30px;
 }
 .mp-finish-quote {
  font-size: 19px;
  line-height: 1.42;
 }
 .mp-finish-text {
  margin-top: 15px;
  font-size: 15px;
  line-height: 1.55;
 }
 .mp-finish-navigation {
  flex-direction: column-reverse;
  gap: 10px;
  margin-top: 23px;
 }
 .mp-finish-navigation .mp-primary-button,
 .mp-finish-navigation .mp-secondary-button {
  width: 100%;
 }
}
@media (prefers-reduced-motion: reduce) {
 .mp-finish-slide.is-active .mp-finish-image-wrap,
 .mp-finish-slide.is-active .mp-finish-title,
 .mp-finish-slide.is-active .mp-finish-quote,
 .mp-finish-slide.is-active .mp-finish-text { animation: none; }
}