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

*:not(i) {
    font-family: "Gilmer", sans-serif !important;
}

html {
    overflow-x: hidden !important;
}

body {
    padding: 0;
    margin: 0;
    overflow-x: unset;
    background-color: var(--color-bg-body) !important;
}

body.pages-body {}

body button {
    background-color: unset;
    border: unset;
    transition: all .4s ease-in-out;
}

body a {
    text-decoration: unset;
    color: inherit;
    transition: all .4s ease-in-out;
}

body svg {
    transition: all .4s ease-in-out;
}

body a:hover,
body button:hover {
    transition: all .4s ease-in-out;
}

body li {
    list-style: none;
}

body ul {
    padding-left: 0;
    margin-bottom: 0;
}

body img {
    width: 100%;
    display: block;
    position: relative;
}

body p {
    font-size: 16px;
    margin: 0;
}

input:focus,
textarea:focus,
select:focus {
    outline: 0 !important;
}

input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 0 !important;
}

/* START HEADER */

/* Şanlı Türk header */
.sanli-header {
    --sanli-header-bg: #111317;
    --sanli-header-text: var(--color-text-inverse);
    --sanli-header-muted: color-mix(in srgb, var(--color-text-inverse), transparent 48%);
    --sanli-header-accent: var(--color-danger);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: var(--z-sticky);
    color: var(--sanli-header-text);
}

.sanli-header__top {
    height: 44px;
    background: var(--sanli-header-bg);
    border-bottom: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 96%);
}

.sanli-header__top-inner,
.sanli-header__contact,
.sanli-header__utilities,
.sanli-header__social,
.sanli-header__language,
.sanli-header__catalog {
    display: flex;
    align-items: center;
}

.sanli-header__top-inner {
    height: 100%;
    justify-content: space-between;
}

.sanli-header__contact {
    gap: 36px;
}

.sanli-header__contact a,
.sanli-header__utilities a {
    color: var(--sanli-header-muted);
    font-size: 13px;
    font-weight: var(--font-weight-medium);
    line-height: 1;
}

.sanli-header__contact a {
    display: flex;
    align-items: center;
    gap: 9px;
}

.sanli-header__contact a:hover,
.sanli-header__utilities a:hover {
    color: var(--sanli-header-text);
}

.sanli-header__contact i,
.sanli-header__language i {
    font-size: 16px;
}

.sanli-header__utilities {
    height: 100%;
    gap: 17px;
}

.sanli-header__social {
    gap: 16px;
}

.sanli-header__social a {
    font-size: 15px;
}

.sanli-header__divider {
    width: 1px;
    height: 20px;
    background-color: color-mix(in srgb, var(--color-text-inverse), transparent 84%);
}

.sanli-header__language {
    gap: 7px;
}

.sanli-header__catalog {
    min-width: 124px;
    height: 35px;
    justify-content: center;
    gap: 8px;
    padding: 0 18px;
    border: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 68%);
    border-radius: var(--radius-full);
    color: var(--sanli-header-text) !important;
    font-weight: var(--font-weight-semibold) !important;
}

.sanli-header__main {
    position: relative;
    height: 92px;
    isolation: isolate;
    overflow: visible;
    background: transparent;
}

.sanli-header__main-inner {
    height: 100%;
    display: grid;
    grid-template-columns: 265px minmax(0, 1fr) auto;
    align-items: center;
    gap: 34px;
}

.sanli-header__logo {
    display: block;
    width: 205px;
    color: var(--sanli-header-text);
}

.sanli-header__logo svg {
    display: block;
    width: 100%;
    height: auto;
}

.sanli-header__nav ul {
    display: flex;
    justify-content: flex-end;
    align-items: stretch;
    gap: 34px;
}

.sanli-header__nav li,
.sanli-header__nav a {
    height: 92px;
}

.sanli-header__nav a {
    position: relative;
    display: flex;
    align-items: center;
    gap: 4px;
    color: color-mix(in srgb, var(--sanli-header-text), transparent 18%);
    font-size: 15px;
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
}

.sanli-header__nav a i {
    color: var(--sanli-header-muted);
    font-size: 13px;
}

.sanli-header__nav a::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 27px;
    left: 0;
    height: 2px;
    border-radius: var(--radius-full);
    background-color: var(--sanli-header-accent);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform var(--transition-normal);
}

.sanli-header__nav a:hover,
.sanli-header__nav a.active {
    color: var(--sanli-header-text);
}

.sanli-header__nav a:hover::after,
.sanli-header__nav a.active::after {
    transform: scaleX(1);
    transform-origin: left;
}

.sanli-header__actions {
    display: flex;
    align-items: center;
    gap: 27px;
}

.sanli-header__search,
.sanli-header__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--sanli-header-text);
}

.sanli-header__search {
    font-size: 22px;
}

.sanli-header__offer {
    height: 50px;
    min-width: 149px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 0 24px;
    border-radius: var(--radius-lg);
    background-color: var(--sanli-header-accent);
    color: var(--sanli-header-text);
    font-size: 15px;
    font-weight: var(--font-weight-semibold);
}

.sanli-header__offer:hover {
    background-color: color-mix(in srgb, var(--sanli-header-accent), black 14%);
    color: var(--sanli-header-text);
}

.sanli-header__offer i {
    font-size: 18px;
}

.sanli-header__toggle {
    display: none;
    width: 42px;
    height: 42px;
    font-size: 24px;
}

@media (max-width: 1199px) {
    .sanli-header__contact {
        gap: 20px;
    }

    .sanli-header__main-inner {
        grid-template-columns: 210px minmax(0, 1fr) auto;
        gap: 20px;
    }

    .sanli-header__logo {
        width: 185px;
    }

    .sanli-header__nav ul {
        gap: 19px;
    }

    .sanli-header__actions {
        gap: 18px;
    }

    .sanli-header__offer {
        min-width: 130px;
        padding: 0 18px;
    }
}

@media (max-width: 991px) {
    .sanli-header__contact a:nth-child(3) {
        display: none;
    }

    .sanli-header__main-inner {
        display: flex;
        justify-content: space-between;
    }

    .sanli-header__nav {
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        padding: 8px 20px 20px;
        background-color: var(--sanli-header-bg);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-8px);
        transition: opacity var(--transition-normal), transform var(--transition-normal), visibility var(--transition-normal);
    }

    .sanli-header.menu-open .sanli-header__nav {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .sanli-header__nav ul {
        display: block;
    }

    .sanli-header__nav li,
    .sanli-header__nav a {
        height: auto;
    }

    .sanli-header__nav a {
        justify-content: space-between;
        padding: 13px 0;
    }

    .sanli-header__nav a::after {
        right: auto;
        bottom: 6px;
        width: 40px;
    }

    .sanli-header__toggle {
        display: inline-flex;
    }
}

@media (max-width: 767px) {
    .sanli-header .container {
        width: min(100% - 28px, 1324px);
    }

    .sanli-header__top {
        height: 38px;
    }

    .sanli-header__contact a {
        font-size: 11px;
    }

    .sanli-header__contact a:nth-child(2),
    .sanli-header__social,
    .sanli-header__utilities>.sanli-header__divider:first-of-type {
        display: none;
    }

    .sanli-header__utilities {
        gap: 10px;
    }

    .sanli-header__catalog {
        min-width: auto;
        height: 30px;
        padding: 0 11px;
        font-size: 11px !important;
    }

    .sanli-header__main {
        height: 76px;
    }

    .sanli-header__logo {
        width: 164px;
    }

    .sanli-header__offer {
        display: none;
    }

    .sanli-header__actions {
        gap: 14px;
    }
}

/* START SANLI HERO */
.sanli-hero {
    --sanli-hero-accent: var(--color-danger);
    position: relative;
    min-height: 845px;
    overflow: hidden;
    color: var(--color-text-inverse);
    background-image:
        linear-gradient(90deg, rgba(4, 8, 11, .77) 0%, rgba(4, 8, 11, .62) 43%, rgba(4, 8, 11, .25) 69%, rgba(4, 8, 11, .08) 100%),
        url("assets/images/sanli-hero-facade.webp");
    background-position: center;
    background-size: cover;
}

.sanli-hero::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 2px;
    background-color: var(--sanli-hero-accent);
}

.sanli-hero__container {
    min-height: 845px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 422px;
    align-items: center;
    gap: 86px;
    padding-top: 118px;
    padding-bottom: 36px;
}

.sanli-hero__content {
    padding-top: 27px;
}

.sanli-hero__eyebrow {
    margin-bottom: 23px;
    color: color-mix(in srgb, var(--color-text-inverse), transparent 22%);
    font-size: 15px;
    font-weight: var(--font-weight-medium);
}

.sanli-hero h1 {
    max-width: 700px;
    margin: 0 0 23px;
    color: var(--color-text-inverse);
    font-size: clamp(52px, 4vw, 70px);
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -2.9px;
}

.sanli-hero__description {
    max-width: 700px;
    color: color-mix(in srgb, var(--color-text-inverse), transparent 27%);
    font-size: 18px;
    font-weight: var(--font-weight-normal);
    line-height: 1.75;
}

.sanli-hero__buttons {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 34px;
}

.sanli-hero__primary-button,
.sanli-hero__secondary-button {
    height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    color: var(--color-text-inverse);
    font-size: 15px;
    font-weight: var(--font-weight-semibold);
}

.sanli-hero__primary-button {
    min-width: 161px;
    gap: 14px;
    padding: 0 27px;
    background-color: var(--sanli-hero-accent);
}

.sanli-hero__primary-button:hover,
.sanli-quote__submit:hover {
    background-color: color-mix(in srgb, var(--sanli-hero-accent), black 14%);
    color: var(--color-text-inverse);
}

.sanli-hero__secondary-button {
    min-width: 230px;
    padding: 0 27px;
    border: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 49%);
}

.sanli-hero__secondary-button:hover {
    border-color: var(--color-text-inverse);
    color: var(--color-text-inverse);
}

.sanli-quote {
    width: 422px;
    padding: 29px 30px 31px;
    border-radius: 20px;
    background-color: var(--color-bg-surface);
    color: var(--color-text-primary);
    box-shadow: var(--shadow-xl);
}

.sanli-quote__head h2 {
    margin: 0 0 6px;
    font-size: 20px;
    font-weight: var(--font-weight-bold);
    line-height: 1.25;
}

.sanli-quote__head p {
    color: var(--color-text-secondary);
    font-size: 14px;
    line-height: 1.6;
}

.sanli-quote__types {
    height: 54px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2px;
    margin: 23px 0 22px;
    padding: 5px;
    border: 0;
    border-radius: var(--radius-full);
    background-color: var(--color-bg-muted);
}

.sanli-quote__types label,
.sanli-quote__types span {
    height: 100%;
}

.sanli-quote__types label {
    position: relative;
    cursor: pointer;
}

.sanli-quote__types input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.sanli-quote__types span {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    color: var(--color-text-secondary);
    font-size: 13px;
    font-weight: var(--font-weight-semibold);
    transition: var(--transition-fast);
}

.sanli-quote__types input:checked+span {
    background-color: var(--color-bg-surface);
    color: var(--color-text-primary);
    box-shadow: var(--shadow-md);
}

.sanli-quote__field {
    display: block;
    margin-bottom: 16px;
}

.sanli-quote__field>span {
    display: block;
    margin-bottom: 9px;
    font-size: 12px;
    font-weight: var(--font-weight-semibold);
}

.sanli-quote__field input {
    width: 100%;
    height: 51px;
    padding: 0 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background-color: var(--color-bg-surface);
    color: var(--color-text-primary);
    font-size: 14px;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.sanli-quote__field input::placeholder {
    color: color-mix(in srgb, var(--color-text-secondary), transparent 45%);
}

.sanli-quote__field input:focus {
    border-color: var(--sanli-hero-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sanli-hero-accent), transparent 88%);
}

.sanli-quote__submit {
    width: 100%;
    height: 56px;
    margin-top: 5px;
    border-radius: var(--radius-md);
    background-color: var(--sanli-hero-accent);
    color: var(--color-text-inverse);
    font-size: 15px;
    font-weight: var(--font-weight-semibold);
}

.sanli-quote small {
    display: block;
    margin-top: 15px;
    color: var(--color-text-secondary);
    font-size: 11px;
    text-align: center;
}

@media (max-width: 1199px) {
    .sanli-hero__container {
        grid-template-columns: minmax(0, 1fr) 380px;
        gap: 42px;
    }

    .sanli-quote {
        width: 380px;
    }

    .sanli-hero h1 {
        font-size: 55px;
    }

    .sanli-hero__description {
        font-size: 16px;
    }
}

@media (max-width: 991px) {
    .sanli-header.menu-open .sanli-header__main {
        background-color: var(--sanli-header-bg);
    }

    .sanli-hero__container {
        grid-template-columns: 1fr;
        gap: 45px;
        padding-top: 145px;
        padding-bottom: 65px;
    }

    .sanli-hero__content {
        padding-top: 0;
    }

    .sanli-quote {
        width: min(100%, 500px);
    }
}

@media (max-width: 767px) {

    .sanli-hero,
    .sanli-hero__container {
        min-height: auto;
    }

    .sanli-hero__container {
        padding-top: 125px;
    }

    .sanli-hero h1 {
        font-size: 42px;
        line-height: 1.12;
        letter-spacing: -1.7px;
    }

    .sanli-hero__description {
        font-size: 15px;
        line-height: 1.65;
    }

    .sanli-hero__desktop-break {
        display: none;
    }

    .sanli-hero__buttons {
        align-items: stretch;
        flex-direction: column;
    }

    .sanli-hero__primary-button,
    .sanli-hero__secondary-button {
        width: 100%;
    }

    .sanli-quote {
        padding: 25px 20px;
        border-radius: 16px;
    }
}

/* END SANLI HERO */

/* START SANLI SHORTCUTS */
.sanli-shortcuts {
    --sanli-shortcuts-bg: #111317;
    --sanli-shortcuts-accent: var(--color-danger);
    width: 100%;
    background-color: var(--sanli-shortcuts-bg);
}

.sanli-shortcuts__container {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sanli-shortcuts__item {
    min-width: 0;
    height: 100px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 12px;
    padding: 0 31px;
    border-left: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 88%);
    color: var(--color-text-inverse);
    transition: background-color var(--transition-normal);
}

.sanli-shortcuts__item:last-child {
    border-right: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 88%);
}

.sanli-shortcuts__icon {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--sanli-shortcuts-accent);
}

.sanli-shortcuts__icon svg {
    width: 38px;
    height: 38px;
    overflow: visible;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sanli-shortcuts__copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sanli-shortcuts__copy small {
    overflow: hidden;
    color: color-mix(in srgb, var(--color-text-inverse), transparent 58%);
    font-size: 12px;
    font-weight: var(--font-weight-normal);
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sanli-shortcuts__copy strong {
    overflow: hidden;
    color: var(--color-text-inverse);
    font-size: 16px;
    font-weight: var(--font-weight-semibold);
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sanli-shortcuts__item>i {
    color: color-mix(in srgb, var(--color-text-inverse), transparent 65%);
    font-size: 18px;
    transition: transform var(--transition-fast), color var(--transition-fast);
}

.sanli-shortcuts__item:hover {
    background-color: color-mix(in srgb, var(--color-text-inverse), transparent 96%);
    color: var(--color-text-inverse);
}

.sanli-shortcuts__item:hover>i {
    color: var(--color-text-inverse);
    transform: translateX(4px);
}

.sanli-shortcuts__item.active,
.sanli-shortcuts__item.active:hover {
    border-color: var(--sanli-shortcuts-accent);
    background-color: var(--sanli-shortcuts-accent);
}

.sanli-shortcuts__item.active .sanli-shortcuts__icon,
.sanli-shortcuts__item.active>i,
.sanli-shortcuts__item.active .sanli-shortcuts__copy small {
    color: var(--color-text-inverse);
}

.sanli-shortcuts__item.active .sanli-shortcuts__copy small {
    opacity: .72;
}

@media (max-width: 1199px) {
    .sanli-shortcuts__item {
        grid-template-columns: 36px minmax(0, 1fr) 16px;
        gap: 9px;
        padding: 0 18px;
    }

    .sanli-shortcuts__icon,
    .sanli-shortcuts__icon svg {
        width: 34px;
        height: 34px;
    }

    .sanli-shortcuts__copy strong {
        font-size: 14px;
    }
}

@media (max-width: 767px) {
    .sanli-shortcuts__container {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sanli-shortcuts__item {
        height: 88px;
        border-bottom: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 88%);
    }

    .sanli-shortcuts__item:nth-child(2) {
        border-right: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 88%);
    }

    .sanli-shortcuts__item>i {
        display: none;
    }
}

@media (max-width: 420px) {
    .sanli-shortcuts__container {
        grid-template-columns: 1fr;
    }

    .sanli-shortcuts__item {
        border-right: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 88%);
    }
}

/* END SANLI SHORTCUTS */

/* START SANLI SERVICES */
.sanli-services {
    padding: 73px 0 120px;
    background-color: var(--color-bg-surface);
}

.sanli-services__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 65px;
}

.sanli-services__eyebrow {
    display: block;
    margin-bottom: 22px;
    color: var(--color-danger);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
}

.sanli-services__intro h2 {
    margin: 0 0 23px;
    color: var(--color-text-primary);
    font-size: clamp(44px, 3.1vw, 56px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -2.4px;
}

.sanli-services__intro p {
    color: var(--color-text-secondary);
    font-size: 17px;
    line-height: 1.65;
}

.sanli-services__navigation {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 4px;
}

.sanli-services__navigation button {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    color: var(--color-text-primary);
    font-size: 19px;
}

.sanli-services__navigation button:hover {
    border-color: var(--color-text-primary);
}

.sanli-services__navigation button.swiper-button-disabled {
    color: var(--color-border-strong);
    cursor: default;
    opacity: .55;
}

.sanli-services__slider {
    width: 100%;
    overflow: hidden;
}

body .sanli-services__slider {
    display: block;
}

.sanli-service-card,
.swiper-slide.sanli-service-card {
    position: relative;
    height: 396px;
    overflow: hidden;
    border-radius: 12px;
    background-color: var(--color-bg-muted);
}

.sanli-service-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.sanli-service-card__shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(4, 7, 10, .65) 0%, rgba(4, 7, 10, .12) 48%, rgba(4, 7, 10, .28) 100%);
    pointer-events: none;
}

.sanli-service-card h3 {
    position: absolute;
    top: 29px;
    left: 30px;
    z-index: 1;
    margin: 0;
    color: var(--color-text-inverse);
    font-size: 23px;
    font-weight: var(--font-weight-bold);
    line-height: 1.12;
    letter-spacing: -.55px;
}

.sanli-service-card>a {
    position: absolute;
    bottom: 28px;
    left: 29px;
    z-index: 1;
    width: 53px;
    height: 53px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    background-color: var(--color-bg-surface);
    color: var(--color-text-primary);
    font-size: 19px;
}

.sanli-service-card:hover img {
    transform: scale(1.045);
}

.sanli-service-card:hover>a {
    background-color: var(--color-danger);
    color: var(--color-text-inverse);
}

@media (max-width: 991px) {
    .sanli-services {
        padding: 65px 0 85px;
    }

    .sanli-services__head {
        margin-bottom: 45px;
    }

    .sanli-services__intro h2 {
        font-size: 44px;
    }

    .sanli-services__intro p {
        font-size: 15px;
    }

    .sanli-service-card,
    .swiper-slide.sanli-service-card {
        height: 380px;
    }
}

@media (max-width: 767px) {
    .sanli-services {
        padding: 50px 0 65px;
    }

    .sanli-services__head {
        align-items: flex-start;
        margin-bottom: 34px;
    }

    .sanli-services__eyebrow {
        margin-bottom: 16px;
    }

    .sanli-services__intro h2 {
        margin-bottom: 18px;
        font-size: 36px;
        letter-spacing: -1.5px;
    }

    .sanli-services__intro p br {
        display: none;
    }

    .sanli-services__navigation {
        align-self: flex-end;
        margin-left: 15px;
    }

    .sanli-services__navigation button {
        width: 43px;
        height: 43px;
    }

    .sanli-service-card,
    .swiper-slide.sanli-service-card {
        height: 390px;
    }
}

@media (max-width: 520px) {
    .sanli-services__head {
        display: block;
    }

    .sanli-services__navigation {
        justify-content: flex-end;
        margin: 25px 0 0;
    }
}

/* END SANLI SERVICES */

/* START SANLI ABOUT */
.sanli-about {
    padding: 111px 0 128px;
    background-color: var(--color-bg-section);
}

.sanli-about__container {
    display: grid;
    grid-template-columns: minmax(0, 560px) minmax(0, 1fr);
    align-items: center;
    gap: 113px;
}

.sanli-about__eyebrow {
    display: block;
    margin-bottom: 23px;
    color: var(--color-danger);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
}

.sanli-about__content h2 {
    margin: 0 0 31px;
    color: var(--color-text-primary);
    font-size: clamp(43px, 3vw, 55px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -2.3px;
}

.sanli-about__text {
    max-width: 545px;
}

.sanli-about__text p {
    color: var(--color-text-secondary);
    font-size: 16px;
    line-height: 1.72;
}

.sanli-about__text p+p {
    margin-top: 17px;
}

.sanli-about__button {
    width: 181px;
    height: 57px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 27px;
    margin-top: 36px;
    border-radius: var(--radius-md);
    background-color: var(--color-text-primary);
    color: var(--color-text-inverse);
    font-size: 15px;
    font-weight: var(--font-weight-semibold);
}

.sanli-about__button:hover {
    background-color: var(--color-danger);
    color: var(--color-text-inverse);
}

.sanli-about__visual {
    position: relative;
    min-height: 563px;
}

.sanli-about__outline {
    position: absolute;
    top: 0;
    right: 0;
    width: 406px;
    height: 328px;
    border: 2px solid var(--color-danger);
    border-radius: 20px;
}

.sanli-about__main-image {
    position: absolute;
    top: 16px;
    right: 17px;
    width: 550px;
    height: 493px;
    overflow: hidden;
    margin: 0;
    border-radius: 20px;
    box-shadow: 0 27px 45px rgba(17, 24, 39, .13);
}

.sanli-about__main-image img,
.sanli-about__small-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sanli-about__main-image img {
    object-position: center 43%;
}

.sanli-about__small-image {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 325px;
    height: 248px;
    overflow: hidden;
    margin: 0;
    padding: 10px;
    border-radius: 16px;
    background-color: var(--color-bg-surface);
    box-shadow: 0 21px 44px rgba(17, 24, 39, .16);
}

.sanli-about__small-image img {
    border-radius: 2px;
}

@media (max-width: 1199px) {
    .sanli-about__container {
        grid-template-columns: minmax(0, 1fr) minmax(0, 520px);
        gap: 55px;
    }

    .sanli-about__main-image {
        width: 475px;
    }

    .sanli-about__content h2 {
        font-size: 45px;
    }
}

@media (max-width: 991px) {
    .sanli-about {
        padding: 80px 0 105px;
    }

    .sanli-about__container {
        grid-template-columns: 1fr;
        gap: 65px;
    }

    .sanli-about__content,
    .sanli-about__text {
        max-width: 650px;
    }

    .sanli-about__visual {
        width: min(100%, 650px);
        margin-left: auto;
    }

    .sanli-about__main-image {
        width: calc(100% - 50px);
    }
}

@media (max-width: 767px) {
    .sanli-about {
        padding: 60px 0 85px;
    }

    .sanli-about__container {
        gap: 48px;
    }

    .sanli-about__eyebrow {
        margin-bottom: 16px;
    }

    .sanli-about__content h2 {
        margin-bottom: 24px;
        font-size: 36px;
        letter-spacing: -1.5px;
    }

    .sanli-about__text p {
        font-size: 15px;
    }

    .sanli-about__button {
        margin-top: 28px;
    }

    .sanli-about__visual {
        min-height: 470px;
    }

    .sanli-about__main-image {
        right: 0;
        width: calc(100% - 25px);
        height: 410px;
    }

    .sanli-about__outline {
        width: 70%;
        height: 280px;
    }

    .sanli-about__small-image {
        width: 245px;
        height: 185px;
        padding: 8px;
    }
}

@media (max-width: 480px) {
    .sanli-about__visual {
        min-height: 388px;
    }

    .sanli-about__main-image {
        height: 340px;
    }

    .sanli-about__small-image {
        width: 200px;
        height: 150px;
    }
}

/* END SANLI ABOUT */

/* START SANLI PROJECTS */
.sanli-projects {
    padding: 93px 0 85px;
    background-color: var(--color-bg-body);
}

.sanli-projects__container {
    position: relative;
}

body .sanli-projects__slider {
    display: block;
    overflow: hidden;
    border-radius: 17px;
}

.sanli-project-slide,
.swiper-slide.sanli-project-slide {
    position: relative;
    height: 720px;
    overflow: hidden;
    border-radius: 17px;
    background-color: var(--color-bg-muted);
}

.sanli-project-slide__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.sanli-project-slide__card {
    position: absolute;
    top: 96px;
    left: 55px;
    width: 568px;
    min-height: 529px;
    padding: 44px 48px 45px;
    border-radius: 14px;
    background-color: var(--color-bg-surface);
    color: var(--color-text-primary);
    box-shadow: var(--shadow-xl);
}

.sanli-project-slide__card h2 {
    margin: 0 0 40px;
    font-size: 36px;
    font-weight: 800;
    line-height: 1.17;
    letter-spacing: -1.3px;
}

.sanli-project-slide__card ul {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.sanli-project-slide__card li {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: center;
    gap: 13px;
    color: var(--color-text-secondary);
    font-size: 14px;
    line-height: 1.2;
}

.sanli-project-slide__card li i {
    color: var(--color-text-primary);
    font-size: 20px;
    line-height: 1;
}

.sanli-project-slide__card>a {
    width: 217px;
    height: 57px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 27px;
    margin-top: 40px;
    border-radius: var(--radius-md);
    background-color: var(--color-danger);
    color: var(--color-text-inverse);
    font-size: 15px;
    font-weight: var(--font-weight-semibold);
}

.sanli-project-slide__card>a:hover {
    background-color: color-mix(in srgb, var(--color-danger), black 14%);
    color: var(--color-text-inverse);
}

.sanli-projects__navigation {
    position: absolute;
    right: 45px;
    bottom: 45px;
    z-index: 3;
    display: flex;
    gap: 11px;
}

.sanli-projects__navigation button {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 52%);
    border-radius: var(--radius-full);
    background-color: color-mix(in srgb, var(--color-text-primary), transparent 52%);
    color: var(--color-text-inverse);
    font-size: 19px;
    backdrop-filter: blur(4px);
}

.sanli-projects__navigation button:hover {
    background-color: var(--color-danger);
    border-color: var(--color-danger);
}

.sanli-projects__navigation button.swiper-button-disabled {
    opacity: .55;
}

@media (max-width: 991px) {
    .sanli-projects {
        padding: 70px 0;
    }

    .sanli-project-slide,
    .swiper-slide.sanli-project-slide {
        height: 680px;
    }

    .sanli-project-slide__card {
        top: 65px;
        left: 40px;
        width: 520px;
    }
}

@media (max-width: 767px) {
    .sanli-projects {
        padding: 55px 0;
    }

    .sanli-project-slide,
    .swiper-slide.sanli-project-slide {
        height: 690px;
    }

    .sanli-project-slide__card {
        top: 24px;
        right: 20px;
        left: 20px;
        width: auto;
        min-height: auto;
        padding: 30px 24px;
    }

    .sanli-project-slide__card h2 {
        margin-bottom: 28px;
        font-size: 29px;
    }

    .sanli-project-slide__card ul {
        gap: 15px;
    }

    .sanli-project-slide__card>a {
        margin-top: 30px;
    }

    .sanli-projects__navigation {
        right: 24px;
        bottom: 24px;
    }

    .sanli-projects__navigation button {
        width: 45px;
        height: 45px;
    }
}

@media (max-width: 420px) {
    .sanli-project-slide,
    .swiper-slide.sanli-project-slide {
        height: 735px;
    }

    .sanli-project-slide__card li {
        font-size: 13px;
    }
}

/* END SANLI PROJECTS */

/* START SANLI COMPLETED PROJECTS */
.sanli-completed {
    padding: 78px 0 113px;
    background-color: var(--color-bg-section);
}

.sanli-completed__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

.sanli-completed__eyebrow {
    display: block;
    width: fit-content;
    margin-bottom: 18px;
    padding-top: 9px;
    border-top: 2px solid var(--color-danger);
    color: var(--color-danger);
    font-size: 13px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
}

.sanli-completed__intro h2 {
    margin: 0 0 16px;
    color: var(--color-text-primary);
    font-size: clamp(43px, 3vw, 55px);
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -2.2px;
}

.sanli-completed__intro p {
    color: var(--color-text-secondary);
    font-size: 15px;
    line-height: 1.55;
}

.sanli-completed__all {
    min-width: 132px;
    height: 43px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    margin-bottom: 4px;
    padding: 0 18px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background-color: var(--color-bg-surface);
    color: var(--color-text-primary);
    font-size: 12px;
    font-weight: var(--font-weight-semibold);
}

.sanli-completed__all:hover {
    border-color: var(--color-danger);
    color: var(--color-danger);
}

.sanli-completed__filters {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 28px 0 22px;
}

.sanli-completed__filters button {
    height: 34px;
    padding: 0 15px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    background-color: var(--color-bg-surface);
    color: var(--color-text-secondary);
    font-size: 11px;
    font-weight: var(--font-weight-medium);
}

.sanli-completed__filters button:hover,
.sanli-completed__filters button.active {
    border-color: var(--color-text-primary);
    background-color: var(--color-text-primary);
    color: var(--color-text-inverse);
}

.sanli-completed__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.sanli-completed-card {
    position: relative;
    height: 236px;
    overflow: hidden;
    border-radius: 11px;
    background-color: var(--color-bg-muted);
    transition: opacity var(--transition-normal), transform var(--transition-normal);
}

.sanli-completed-card.is-hidden {
    display: none;
}

.sanli-completed-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.sanli-completed-card__shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 35%, rgba(5, 8, 11, .78) 100%);
    pointer-events: none;
}

.sanli-completed-card>div {
    position: absolute;
    right: 22px;
    bottom: 19px;
    left: 22px;
    z-index: 1;
    color: var(--color-text-inverse);
}

.sanli-completed-card small {
    display: block;
    margin-bottom: 5px;
    color: color-mix(in srgb, var(--color-text-inverse), transparent 33%);
    font-size: 10px;
}

.sanli-completed-card h3 {
    margin: 0;
    font-size: 17px;
    font-weight: var(--font-weight-semibold);
}

.sanli-completed-card>a {
    position: absolute;
    right: 18px;
    bottom: 18px;
    z-index: 2;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    background-color: color-mix(in srgb, var(--color-bg-surface), transparent 8%);
    color: var(--color-text-primary);
    font-size: 14px;
    opacity: 0;
    transform: translateY(6px);
}

.sanli-completed-card:hover img {
    transform: scale(1.045);
}

.sanli-completed-card:hover>a {
    opacity: 1;
    transform: translateY(0);
}

.sanli-completed-card:hover>div {
    padding-right: 42px;
}

@media (max-width: 991px) {
    .sanli-completed {
        padding: 70px 0 90px;
    }

    .sanli-completed__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .sanli-completed {
        padding: 55px 0 70px;
    }

    .sanli-completed__head {
        align-items: flex-start;
    }

    .sanli-completed__intro h2 {
        font-size: 36px;
        letter-spacing: -1.5px;
    }

    .sanli-completed__intro p br {
        display: none;
    }

    .sanli-completed__all {
        flex: 0 0 auto;
        margin-left: 18px;
    }

    .sanli-completed__filters {
        overflow-x: auto;
        padding-bottom: 4px;
    }

    .sanli-completed__filters::-webkit-scrollbar {
        display: none;
    }
}

@media (max-width: 575px) {
    .sanli-completed__head {
        display: block;
    }

    .sanli-completed__all {
        margin: 22px 0 0;
    }

    .sanli-completed__grid {
        grid-template-columns: 1fr;
    }

    .sanli-completed-card {
        height: 245px;
    }
}

/* END SANLI COMPLETED PROJECTS */

/* START SANLI REFERENCES */
.sanli-references {
    padding: 108px 0 111px;
    background-color: var(--color-bg-surface);
}

.sanli-references__head {
    margin-bottom: 65px;
    text-align: center;
}

.sanli-references__head>span {
    display: block;
    margin-bottom: 22px;
    color: var(--color-danger);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
}

.sanli-references__head h2 {
    margin: 0;
    color: var(--color-text-primary);
    font-size: clamp(43px, 3vw, 55px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -2.2px;
}

.sanli-references__grid {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    border-top: 1px solid var(--color-border);
    border-left: 1px solid var(--color-border);
}

.sanli-reference-logo {
    height: 168px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 18px;
    border-right: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    color: color-mix(in srgb, var(--color-text-secondary), transparent 20%);
    filter: grayscale(1);
    text-align: center;
    transition: color var(--transition-normal), background-color var(--transition-normal);
}

.sanli-reference-logo:hover {
    background-color: color-mix(in srgb, var(--color-bg-muted), transparent 45%);
    color: var(--color-text-primary);
}

.sanli-reference-logo b,
.sanli-reference-logo span,
.sanli-reference-logo small {
    display: block;
}

.sanli-reference-logo span {
    font-size: 11px;
    font-weight: var(--font-weight-bold);
    line-height: 1.1;
    text-transform: uppercase;
}

.sanli-reference-logo small {
    margin-top: 3px;
    font-size: 7px;
    font-weight: var(--font-weight-medium);
    letter-spacing: .8px;
}

.sanli-reference-logo.seal {
    flex-direction: column;
}

.sanli-reference-logo.seal b {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 5px double currentColor;
    border-radius: var(--radius-full);
    font-size: 16px;
    letter-spacing: -1px;
}

.sanli-reference-logo.seal.wide b {
    width: 78px;
    height: 55px;
    border-width: 2px;
    border-radius: 50%;
    font-size: 18px;
}

.sanli-reference-logo.flower {
    flex-direction: column;
}

.sanli-reference-logo.flower b {
    font-size: 48px;
    line-height: .8;
}

.sanli-reference-logo.kayseray,
.sanli-reference-logo.kayserigaz,
.sanli-reference-logo.university,
.sanli-reference-logo.wordmark {
    flex-direction: column;
}

.sanli-reference-logo.kayseray b {
    font-size: 67px;
    font-weight: 800;
    line-height: .65;
}

.sanli-reference-logo.kayserigaz b {
    font-size: 13px;
    letter-spacing: 3px;
}

.sanli-reference-logo.kayserigaz i {
    width: 58px;
    height: 35px;
    border-radius: 50% 50% 48% 48%;
    background: linear-gradient(180deg, transparent 0 35%, currentColor 36% 100%);
}

.sanli-reference-logo.university b {
    font-size: 43px;
    line-height: .9;
}

.sanli-reference-logo.university span {
    font-family: Georgia, serif !important;
    font-size: 14px;
}

.sanli-reference-logo.wordmark {
    gap: 3px;
}

.sanli-reference-logo.wordmark b {
    font-size: 34px;
    line-height: 1;
}

.sanli-reference-logo.wordmark span {
    font-size: 16px;
    text-transform: none;
}

.sanli-reference-logo.wordmark.bilir {
    flex-direction: row;
}

.sanli-reference-logo.wordmark.haksa b {
    width: 51px;
    height: 51px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid currentColor;
    border-radius: var(--radius-full);
    font-size: 39px;
    font-style: italic;
}

.sanli-reference-logo.wordmark.compact {
    flex-direction: row;
}

.sanli-reference-logo.wordmark.compact span {
    font-size: 10px;
}

@media (max-width: 1199px) {
    .sanli-references__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .sanli-references {
        padding: 65px 0 75px;
    }

    .sanli-references__head {
        margin-bottom: 42px;
    }

    .sanli-references__head h2 {
        font-size: 36px;
        letter-spacing: -1.5px;
    }

    .sanli-references__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sanli-reference-logo {
        height: 145px;
    }
}

/* END SANLI REFERENCES */

/* START SANLI FAQ */
.sanli-faq {
    padding: 128px 0 126px;
    background-color: var(--color-bg-section);
}

.sanli-faq__container {
    display: grid;
    grid-template-columns: 500px minmax(0, 1fr);
    gap: 128px;
}

.sanli-faq__eyebrow {
    display: block;
    margin-bottom: 24px;
    color: var(--color-danger);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
}

.sanli-faq__intro h2 {
    margin: 0 0 25px;
    color: var(--color-text-primary);
    font-size: clamp(44px, 3vw, 55px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -2.2px;
}

.sanli-faq__intro p {
    color: var(--color-text-secondary);
    font-size: 17px;
    line-height: 1.7;
}

.sanli-faq__intro>a {
    width: 177px;
    height: 57px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 26px;
    margin-top: 38px;
    border-radius: var(--radius-md);
    background-color: var(--color-text-primary);
    color: var(--color-text-inverse);
    font-size: 15px;
    font-weight: var(--font-weight-semibold);
}

.sanli-faq__intro>a:hover {
    background-color: var(--color-danger);
    color: var(--color-text-inverse);
}

.sanli-faq__list {
    border-top: 1px solid var(--color-border);
}

.sanli-faq__item {
    border-bottom: 1px solid var(--color-border);
}

.sanli-faq__item h3 {
    margin: 0;
}

.sanli-faq__item h3 button {
    width: 100%;
    min-height: 91px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    color: var(--color-text-primary);
    text-align: left;
}

.sanli-faq__item h3 button>span {
    font-size: 17px;
    font-weight: var(--font-weight-semibold);
    line-height: 1.35;
}

.sanli-faq__item h3 button>i {
    width: 39px;
    height: 39px;
    flex: 0 0 39px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    font-size: 17px;
    transition: transform var(--transition-normal), background-color var(--transition-normal), color var(--transition-normal);
}

.sanli-faq__item h3 button:hover>i {
    border-color: var(--color-text-primary);
}

.sanli-faq__answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows var(--transition-normal);
}

.sanli-faq__answer p {
    min-height: 0;
    overflow: hidden;
    padding-right: 65px;
    color: var(--color-text-secondary);
    font-size: 14px;
    line-height: 1.65;
    transition: padding-bottom var(--transition-normal);
}

.sanli-faq__item.active .sanli-faq__answer {
    grid-template-rows: 1fr;
}

.sanli-faq__item.active .sanli-faq__answer p {
    padding-bottom: 25px;
}

.sanli-faq__item.active h3 button>i {
    background-color: var(--color-text-primary);
    color: var(--color-text-inverse);
    transform: rotate(180deg);
}

@media (max-width: 1199px) {
    .sanli-faq__container {
        grid-template-columns: 400px minmax(0, 1fr);
        gap: 70px;
    }
}

@media (max-width: 991px) {
    .sanli-faq {
        padding: 85px 0 90px;
    }

    .sanli-faq__container {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .sanli-faq__intro {
        max-width: 600px;
    }
}

@media (max-width: 767px) {
    .sanli-faq {
        padding: 65px 0 70px;
    }

    .sanli-faq__container {
        gap: 48px;
    }

    .sanli-faq__eyebrow {
        margin-bottom: 17px;
    }

    .sanli-faq__intro h2 {
        margin-bottom: 19px;
        font-size: 36px;
        letter-spacing: -1.5px;
    }

    .sanli-faq__intro p {
        font-size: 15px;
    }

    .sanli-faq__intro p br {
        display: none;
    }

    .sanli-faq__intro>a {
        margin-top: 28px;
    }

    .sanli-faq__item h3 button {
        min-height: 78px;
    }

    .sanli-faq__item h3 button>span {
        font-size: 15px;
    }

    .sanli-faq__answer p {
        padding-right: 15px;
    }
}

/* END SANLI FAQ */

/* START SANLI BLOG */
.sanli-blog {
    padding: 98px 0 111px;
    background-color: var(--color-bg-body);
}

.sanli-blog__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 66px;
}

.sanli-blog__intro>span {
    display: block;
    margin-bottom: 22px;
    color: var(--color-danger);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
}

.sanli-blog__intro h2 {
    margin: 0;
    color: var(--color-text-primary);
    font-size: clamp(44px, 3vw, 55px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -2.2px;
}

.sanli-blog__head>a {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 3px;
    padding: 0 1px 12px;
    border-bottom: 2px solid var(--color-danger);
    color: var(--color-text-primary);
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
}

.sanli-blog__head>a:hover {
    color: var(--color-danger);
}

.sanli-blog__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 85px;
}

.sanli-blog-card__image {
    height: 266px;
    display: block;
    overflow: hidden;
    background-color: var(--color-bg-muted);
}

.sanli-blog-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.sanli-blog-card:first-child .sanli-blog-card__image img {
    object-position: center 15%;
}

.sanli-blog-card__content {
    padding-top: 24px;
}

.sanli-blog-card__content>span {
    display: block;
    margin-bottom: 12px;
    color: var(--color-text-secondary);
    font-size: 13px;
    line-height: 1;
}

.sanli-blog-card__content h3 {
    margin: 0;
}

.sanli-blog-card__content h3 a {
    display: block;
    color: var(--color-text-primary);
    font-size: 18px;
    font-weight: var(--font-weight-bold);
    line-height: 1.35;
    letter-spacing: -.35px;
}

.sanli-blog-card:hover .sanli-blog-card__image img {
    transform: scale(1.045);
}

.sanli-blog-card:hover .sanli-blog-card__content h3 a {
    color: var(--color-danger);
}

@media (max-width: 1199px) {
    .sanli-blog__grid {
        gap: 35px;
    }
}

@media (max-width: 991px) {
    .sanli-blog {
        padding: 80px 0 90px;
    }

    .sanli-blog__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .sanli-blog {
        padding: 65px 0 72px;
    }

    .sanli-blog__head {
        margin-bottom: 42px;
    }

    .sanli-blog__intro>span {
        margin-bottom: 17px;
    }

    .sanli-blog__intro h2 {
        font-size: 36px;
        letter-spacing: -1.5px;
    }

    .sanli-blog__head>a {
        flex: 0 0 auto;
        margin-left: 20px;
    }
}

@media (max-width: 575px) {
    .sanli-blog__head {
        align-items: flex-start;
    }

    .sanli-blog__head>a {
        margin-top: 51px;
        font-size: 12px;
    }

    .sanli-blog__grid {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .sanli-blog-card__image {
        height: 255px;
    }
}

/* END SANLI BLOG */

/* START SANLI FOOTER */
.sanli-footer {
    position: relative;
    color: var(--color-text-inverse);
}

.sanli-footer .container {
    width: min(100% - 40px, 1324px);
    max-width: 1324px;
    padding-right: 0;
    padding-left: 0;
    margin-right: auto;
    margin-left: auto;
}

.sanli-footer-cta {
    position: relative;
    min-height: 350px;
    overflow: hidden;
    background-color: var(--color-danger);
}

.sanli-footer-cta__container {
    min-height: 350px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 80px;
}

.sanli-footer-cta__content {
    position: relative;
    z-index: 1;
}

.sanli-footer-cta__content h2 {
    margin: 0 0 20px;
    color: var(--color-text-inverse);
    font-size: clamp(43px, 3vw, 54px);
    font-weight: 800;
    line-height: 1.07;
    letter-spacing: -2.1px;
}

.sanli-footer-cta__content p {
    color: color-mix(in srgb, var(--color-text-inverse), transparent 25%);
    font-size: 17px;
    line-height: 1.65;
}

.sanli-footer-cta__actions {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 15px;
}

.sanli-footer-cta__actions a {
    height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    font-size: 15px;
    font-weight: var(--font-weight-semibold);
}

.sanli-footer-cta__actions .phone {
    min-width: 207px;
    gap: 11px;
    padding: 0 21px;
    background-color: var(--color-bg-surface);
    color: var(--color-danger);
}

.sanli-footer-cta__actions .offer {
    min-width: 152px;
    padding: 0 23px;
    border: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 47%);
    color: var(--color-text-inverse);
}

.sanli-footer-cta__actions .offer:hover {
    background-color: var(--color-bg-surface);
    color: var(--color-danger);
}

.sanli-footer-cta__ring {
    position: absolute;
    border: 75px solid color-mix(in srgb, var(--color-text-inverse), transparent 92%);
    border-radius: var(--radius-full);
    pointer-events: none;
}

.sanli-footer-cta__ring.ring-one {
    right: 326px;
    bottom: -181px;
    width: 493px;
    height: 493px;
}

.sanli-footer-cta__ring.ring-two {
    top: -155px;
    right: -13px;
    width: 536px;
    height: 536px;
}

.sanli-footer-main {
    background-color: var(--color-bg-dark);
}

.sanli-footer-main__container {
    padding-top: 84px !important;
}

.sanli-footer-main__grid {
    display: grid;
    grid-template-columns: 335px 230px 190px minmax(0, 1fr);
    gap: 90px;
    min-height: 310px;
}

.sanli-footer__logo {
    width: 184px;
    display: block;
    margin-bottom: 29px;
    color: var(--color-text-inverse);
}

.sanli-footer__logo svg {
    display: block;
    width: 100%;
}

.sanli-footer__brand>p {
    color: color-mix(in srgb, var(--color-text-inverse), transparent 48%);
    font-size: 14px;
    line-height: 1.75;
}

.sanli-footer__social {
    display: flex;
    gap: 11px;
    margin-top: 28px;
}

.sanli-footer__social a {
    width: 43px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 82%);
    border-radius: var(--radius-md);
    color: var(--color-text-inverse);
    font-size: 16px;
}

.sanli-footer__social a:hover {
    border-color: var(--color-danger);
    background-color: var(--color-danger);
}

.sanli-footer__menu,
.sanli-footer__contact {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.sanli-footer__menu h3,
.sanli-footer__contact h3 {
    margin: 0 0 25px;
    color: var(--color-text-inverse);
    font-size: 15px;
    font-weight: var(--font-weight-bold);
}

.sanli-footer__menu>a {
    margin-bottom: 18px;
    color: color-mix(in srgb, var(--color-text-inverse), transparent 49%);
    font-size: 14px;
    line-height: 1;
}

.sanli-footer__menu>a:hover,
.sanli-footer__contact>a:hover {
    color: var(--color-text-inverse);
}

.sanli-footer__contact>a {
    display: grid;
    grid-template-columns: 19px minmax(0, 1fr);
    gap: 12px;
    margin-bottom: 18px;
    color: color-mix(in srgb, var(--color-text-inverse), transparent 49%);
    font-size: 14px;
    line-height: 1.6;
}

.sanli-footer__contact>a i {
    color: var(--color-danger);
    font-size: 18px;
    line-height: 1.3;
}

.sanli-footer__bottom {
    min-height: 79px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 86%);
    color: color-mix(in srgb, var(--color-text-inverse), transparent 55%);
}

.sanli-footer__bottom p,
.sanli-footer__bottom a {
    font-size: 13px;
}

.sanli-footer__bottom nav {
    display: flex;
    align-items: center;
    gap: 31px;
}

.sanli-footer__bottom a:hover {
    color: var(--color-text-inverse);
}

.sanli-whatsapp {
    position: fixed;
    right: 25px;
    bottom: 24px;
    z-index: var(--z-fixed);
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    background-color: var(--color-success);
    color: var(--color-text-inverse);
    font-size: 29px;
    box-shadow: 0 10px 28px color-mix(in srgb, var(--color-success), transparent 55%);
}

.sanli-whatsapp:hover {
    color: var(--color-text-inverse);
    transform: translateY(-3px);
}

@media (max-width: 1199px) {
    .sanli-footer-main__grid {
        grid-template-columns: 300px 1fr 1fr 1.25fr;
        gap: 45px;
    }
}

@media (max-width: 991px) {
    .sanli-footer-cta__container {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        gap: 35px;
        padding: 60px 0;
    }

    .sanli-footer-main__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 55px 70px;
        padding-bottom: 60px;
    }
}

@media (max-width: 767px) {
    .sanli-footer .container {
        width: min(100% - 28px, 1324px);
    }

    .sanli-footer-cta__content h2 {
        font-size: 37px;
        letter-spacing: -1.5px;
    }

    .sanli-footer-cta__content p {
        font-size: 15px;
    }

    .sanli-footer-cta__content p br {
        display: none;
    }

    .sanli-footer-cta__actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .sanli-footer-cta__actions a {
        width: 100%;
    }

    .sanli-footer-main__grid {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .sanli-footer__brand>p br {
        display: none;
    }

    .sanli-footer__bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 18px;
        padding: 25px 0;
    }

    .sanli-footer__bottom nav {
        flex-wrap: wrap;
        gap: 12px 22px;
    }

    .sanli-whatsapp {
        right: 16px;
        bottom: 16px;
        width: 52px;
        height: 52px;
    }
}

/* END SANLI FOOTER */

.lisanium-header {
    width: 100%;
    transition: all .4s ease;
    position: relative;
}

.lisanium-header .lisanium-header-group {
    display: flex;
    justify-content: end;
    position: relative;
}

.lisanium-header::before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: var(--color-bg-surface);
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(0, -100%);
    transition: all .4s ease;
    z-index: -1;
}

.lisanium-header.sub-menu-active {
    transition: all .4s ease;
    z-index: 999;
}

.lisanium-header.sub-menu-active::before {
    transition: all .4s ease;
    transform: translate(0, 0);
}

.lisanium-header.pages-header {
    position: relative;
    z-index: 999;
}

.lisanium-header .lisanium-header-main {
    width: 85%;
    float: right;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.lisanium-header.full .lisanium-header-main {
    width: 95%;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.lisanium-header .lisanium-topbar {
    position: relative;
    background-color: var(--color-bg-surface);
    line-height: 1;
    padding: 12px 20px;
    border-radius: 0 0 15px 15px;
}

.pages-header.lisanium-header .lisanium-topbar {
    background-color: #F7F7F7;
}

.lisanium-header .lisanium-topbar .topbar-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col {
    display: flex;
    align-items: center;
    gap: 30px;
    flex: 1;
    line-height: 1;
}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col .topbar-content {}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col .topbar-content span {
    color: var(--color-text-muted);
    font-size: 12px;
}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col.right {
    justify-content: end;
}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col.left {}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col .topbar-links {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col .topbar-links.language {}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col .topbar-links.language a {
    border: unset !important;
    padding: 0 2px !important;
}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col .topbar-links a {
    color: var(--color-primary);
    font-size: 13px;
    position: relative;
    font-weight: 500;
}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col .topbar-links a i {
    font-size: 18px;
    line-height: 1;
    position: relative;
    top: 2px;
}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col .topbar-links a:not(:first-child) {
    border-left: 1px solid #D4D4D8;
    padding: 0 0 0 10px;
}

.lisanium-header .lisanium-topbar .topbar-group .topbar-col .topbar-links a.active {
    color: #1858A5;
    padding: 0 5px;
    font-weight: 600;
}


.lisanium-header .lisanium-topbar .topbar-group .topbar-col .social-links {}

.social-links {}

.social-links .social-links-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.social-links .social-links-group a {
    border-radius: 12px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-primary);
    color: var(--color-bg-surface);
}

.social-links .social-links-group a:hover {
    background-color: #1858A5;
    color: var(--color-bg-surface);
    border-color: #1858A5;
}

.social-links .social-links-group a i {
    font-size: 16px;
}

.lisanium-header .lisanium-head-main {
    padding: 30px 0;
}

.pages-header.lisanium-header .lisanium-head-main {
    border-color: #EFEFEF;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col {}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col .search-card {
    background-color: var(--color-primary);
    border-radius: 50px;
    height: 50px;
    padding: 2px 2px 5px 4px;
    display: flex;
    align-items: center;
    width: 500px;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col .search-card input {
    background-color: var(--color-bg-surface);
    border-radius: 50px;
    padding: 0 20px;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col .search-card input::placeholder {
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-muted);
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col .search-card .icon {
    position: relative;
    right: unset;
    top: unset;
    transform: translate(0);
    width: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col .search-card .icon i {
    color: var(--color-bg-surface);
    font-size: 18px;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col .actions-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lisanium-header .record-buttons {
    display: flex;
    align-items: center;
    background: var(--color-bg-surface);
    background: -moz-linear-gradient(90deg, color-mix(in srgb, var(--color-bg-surface), transparent 92%) 0%, var(--color-bg-surface) 100%);
    background: -webkit-linear-gradient(90deg, color-mix(in srgb, var(--color-bg-surface), transparent 92%) 0%, var(--color-bg-surface) 100%);
    background: linear-gradient(90deg, color-mix(in srgb, var(--color-bg-surface), transparent 92%) 0%, var(--color-bg-surface) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="var(--color-bg-surface)fff", endColorstr="#000000", GradientType=1);
    border-radius: 0 50px 50px 0;
    padding: 10px 20px;
    gap: 25px;
}

.lisanium-header .record-buttons .lisanium-button {
    background-color: unset;
    font-size: 14px;
    font-weight: 600;
    height: auto;
    padding: 0;
}

.lisanium-header .record-buttons .lisanium-button.login:hover {
    background-color: unset !important;
    color: var(--color-secondary) !important;
}

.lisanium-header .record-buttons .lisanium-button.register:hover {
    background-color: unset !important;
    color: var(--color-primary) !important;
}

.lisanium-header .record-buttons .lisanium-button .icon {
    background-color: color-mix(in srgb, var(--color-primary), transparent 92%);
    border-radius: 12px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lisanium-header .record-buttons .lisanium-button.login {
    color: var(--color-primary);
    flex-direction: column;
    line-height: 1;
    gap: 5px;
    align-items: flex-end;
}

.lisanium-header .record-buttons .lisanium-button.register {
    color: var(--color-secondary);
}

.lisanium-header .record-buttons .lisanium-button span {}

.lisanium-header .record-buttons .lisanium-button small {
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-muted);
}

.lisanium-header .record-buttons .lisanium-button .icon img {
    width: 18px;
}

.lisanium-header .cart-button {
    width: fit-content;
}

.lisanium-header .cart-button a {
    background-color: var(--color-secondary);
    display: flex;
    padding: 8px 15px;
    border-radius: 50px;
    gap: 5px;
}

.lisanium-header .cart-button a img {
    width: 24px;
}

.lisanium-header .cart-button a .counter {
    background-color: color-mix(in srgb, var(--color-bg-surface), transparent 92%);
    color: var(--color-bg-surface);
    width: 24px;
    height: 24px;
    font-size: 12px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-logos {}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col .logo {}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col .logo a {}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col .logo a img {
    width: 200px;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-menus {}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-menus .menu-group {}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-menus .menu-group ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-menus .menu-group ul li {
    width: 100%;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-menus .menu-group ul li a {
    color: #000;
    font-size: 14px;
    font-weight: 400;
    display: flex;
    height: 40px;
    align-items: center;
    transition: all .4s ease;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-menus .menu-group ul li a:hover {
    color: #1858A5 !important;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-menus .menu-group ul li a.active {
    color: #1858A5 !important;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-menus .menu-group ul li a.active i {
    transform: rotate(180deg);
    transition: all .4s ease;
}

.lisanium-header.sub-menu-active .lisanium-head-main .lisanium-head-main-group .head-col.head-menus .menu-group ul li a,
.lisanium-header.pages-header .lisanium-head-main .lisanium-head-main-group .head-col.head-menus .menu-group ul li a {
    color: #000;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-actions {
    flex: 1;
    position: relative;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-actions .actions-group {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 20px;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-actions .actions-group .search-action {}

.lisanium-header.pages-header .lisanium-head-main .lisanium-head-main-group .head-col.head-actions .actions-group .search-action svg {
    stroke: #000;
}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-actions .actions-group .search-action img {}

.lisanium-header .lisanium-head-main .lisanium-head-main-group .head-col.head-actions .actions-group a {
    background-color: var(--color-bg-surface)fff52;
    height: 45px;
}

.lisanium-header.sub-menu-active .lisanium-head-main .lisanium-head-main-group .head-col.head-actions .actions-group a,
.lisanium-header.pages-header .lisanium-head-main .lisanium-head-main-group .head-col.head-actions .actions-group a {
    background-color: #E9E9E9;
    color: #000;
}

.lisanium-page-side {
    position: fixed;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 100;
    pointer-events: none;
}

.lisanium-page-side-menu {
    width: 15%;
    padding: 50px 50px 50px 0;
    background-color: var(--color-bg-body) !important;
    position: relative;
    pointer-events: auto;
    height: 100%;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.lisanium-page-side-menu::before {
    content: "";
}

.lisanium-page-side-menu.close {
    width: 5%;
    background-color: transparent !important;
    z-index: -1;
    pointer-events: none;
}

.lisanium-page-side-menu::before {
    content: "";
    position: absolute;
    right: 100%;
    top: 0;
    transform: translate(50%, 0);
    background-color: var(--color-bg-body) !important;
    width: 200%;
    height: 18%;
    border-radius: 0 0 30px 0;
}

.lisanium-page-side-menu.open::before {
    right: 100%;
    transform: translate(0, 0);
    width: 1000%;
    height: 100%;
    border-radius: 0;
}

.lisanium-page-side-menu .side-menu-head {
    margin: 0 0 30px;
}

.lisanium-page-side-menu .side-menu-head .side-menu-button {
    display: flex;
    align-items: center;
    gap: 8px;
    pointer-events: auto;
}

.lisanium-page-side-menu .side-menu-head .side-menu-button.close {}

.lisanium-page-side-menu .side-menu-head .side-menu-button.close .icon {}

.lisanium-page-side-menu .side-menu-head .side-menu-button.close .content {
    width: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-8px);
}

.lisanium-page-side-menu .side-menu-head .side-menu-button .icon {
    border: 2px solid var(--color-primary);
    border-radius: 15px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-bg-surface);
    position: relative;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.lisanium-page-side-menu .side-menu-head .side-menu-button:active .icon {
    transform: scale(0.9);
}

.lisanium-page-side-menu .side-menu-head .side-menu-button .icon img {
    width: 22px;
    position: absolute;
    opacity: 0;
    transform: rotate(-90deg) scale(0.6);
    transition: opacity 0.3s ease, transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.lisanium-page-side-menu .side-menu-head .side-menu-button.open .icon img.close {
    opacity: 1;
    transform: rotate(0) scale(1);
}

.lisanium-page-side-menu .side-menu-head .side-menu-button.close .icon img.open {
    opacity: 1;
    transform: rotate(0) scale(1);
}

.lisanium-page-side-menu .side-menu-head .side-menu-button .content {
    display: flex;
    flex-direction: column;
    line-height: 1;
    text-align: left;
    gap: 2px;
    overflow: hidden;
    white-space: nowrap;
    transition: width 0.35s ease, opacity 0.25s ease, transform 0.35s ease, visibility 0s linear 0s;
}

.lisanium-page-side-menu .side-menu-head .side-menu-button.close .content {
    transition: width 0.35s ease, opacity 0.2s ease, transform 0.3s ease, visibility 0s linear 0.3s;
}

.lisanium-page-side-menu .side-menu-head .side-menu-button .content .text {
    color: var(--color-secondary);
    font-size: 17px;
    font-weight: 500;
}

.lisanium-page-side-menu .side-menu-head .side-menu-button .content .label {
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-muted);
}

.lisanium-page-side-menu .side-menu-body {}

.lisanium-page-side-menu .side-menu-body .side-menu-list {
    overflow: hidden;
    transition: width 0.35s ease, opacity 0.3s ease, transform 0.35s ease, visibility 0s linear 0s;
}

.lisanium-page-side-menu.open .side-menu-body .side-menu-list {
    width: 100%;
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.lisanium-page-side-menu.close .side-menu-body .side-menu-list {
    width: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-12px);
    transition: width 0.35s ease, opacity 0.2s ease, transform 0.3s ease, visibility 0s linear 0.3s;
}

.lisanium-page-side-menu .side-menu-body .side-menu-list ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.lisanium-page-side-menu .side-menu-body .side-menu-list ul li {
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.lisanium-page-side-menu.close .side-menu-body .side-menu-list ul li {
    transform: translateX(-6px);
    opacity: 0;
}

.lisanium-page-side-menu.open .side-menu-body .side-menu-list ul li {
    transition-delay: calc(var(--i, 0) * 0.04s);
}

.lisanium-page-side-menu .side-menu-body .side-menu-list ul li a {
    display: flex;
    align-items: center;
    gap: 8px;
}

.lisanium-page-side-menu .side-menu-body .side-menu-list ul li a .icon {
    border-radius: 12px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease;
}

.lisanium-page-side-menu .side-menu-body .side-menu-list ul li a:hover .icon {
    transform: scale(1.08);
}

.lisanium-page-side-menu .side-menu-body .side-menu-list ul li:nth-child(odd) a .icon {
    background-color: color-mix(in srgb, var(--color-primary), transparent 92%);
}

.lisanium-page-side-menu .side-menu-body .side-menu-list ul li:nth-child(even) a .icon {
    background-color: var(--color-bg-surface);
}

.lisanium-page-side-menu .side-menu-body .side-menu-list ul li a .icon img {
    width: 16px;
}

.lisanium-page-side-menu .side-menu-body .side-menu-list ul li a span {
    font-size: 12px;
    font-weight: 400;
    white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {

    .lisanium-page-side-menu,
    .lisanium-page-side-menu * {
        transition: none !important;
    }
}

/* END HEADER */


/* START HERO */

.lisanium-hero {
    position: relative;
    margin: 0 0 100px;
}

.lisanium-hero .lisanium-hero-wrapper {
    display: flex;
    justify-content: end;
}

.lisanium-hero .lisanium-hero-wrapper .lisanium-hero-area {
    width: 85%;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.lisanium-hero.full .lisanium-hero-wrapper .lisanium-hero-area {
    width: 95%;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.lisanium-hero .lisanium-hero-wrapper .hero-group {
    display: flex;
    width: 100%;
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-media-slider {
    width: 75%;
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-media-slider .media-slider-wrapper {
    position: relative;
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-media-slider .media-slider-wrapper .navigation-group {}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-media-slider .media-slider-wrapper .navigation-group button {
    width: 40px;
    height: 40px;
    border-radius: 15px;
    background-color: var(--color-bg-surface);
    border-color: var(--color-bg-surface);
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
    -webkit-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
    -moz-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-media-slider .media-slider-wrapper .navigation-group button i {
    font-size: 18px;
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-media-slider .media-slider-wrapper .navigation-group button.prev {
    left: -20px;
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-media-slider .media-slider-wrapper .navigation-group button.next {
    right: -20px;
}

.swiper.swiper-hero {}

.swiper.swiper-hero .swiper-wrapper {}

.swiper.swiper-hero .swiper-wrapper .swiper-slide {}

.swiper.swiper-hero .swiper-wrapper .swiper-slide a {}

.swiper.swiper-hero .swiper-wrapper .swiper-slide a .image {}

.swiper.swiper-hero .swiper-wrapper .swiper-slide a .image img {
    border-radius: 25px;
}

.hero-pagination {
    width: 100% !important;
    height: 50px;
    position: absolute;
    top: 100%;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-pagination::before {
    content: "";
    width: 100%;
    height: 1px;
    background-color: var(--color-border);
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
}

.swiper-pagination.swiper-hero-pagination {
    position: relative;
    left: unset !important;
    right: unset !important;
    top: unset !important;
    transform: translate(0, 0);
    bottom: 0 !important;
    background-color: var(--color-bg-body) !important;
    padding: 0 20px;
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-feature-slider {
    width: 25%;
    padding: 0 0 0 30px;
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-feature-slider .feature-slider-wrapper {}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-feature-slider .feature-slider-wrapper .feature-slider-head {
    background-color: color-mix(in srgb, var(--color-primary), transparent 95%);
    border-radius: 20px 20px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 15px 0;
    line-height: 1;
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-feature-slider .feature-slider-wrapper .feature-slider-head::before {
    content: "";
    width: 100%;
    height: 100px;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: color-mix(in srgb, var(--color-primary), transparent 95%);
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-feature-slider .feature-slider-wrapper .feature-slider-head .title {
    color: var(--color-secondary);
    font-size: 16px;
}

.lisanium-hero .lisanium-hero-wrapper .hero-group .hero-feature-slider .feature-slider-wrapper .feature-slider-head .title strong {}

.swiper.swiper-hero-product {}

.swiper.swiper-hero-product+.lisanium-counter {
    background-color: unset;
    padding: 0;
    border-radius: 0;
}

.swiper.swiper-hero-product+.lisanium-counter .lisanium-counter-label {
    font-size: 14px;
}

.swiper.swiper-hero-product+.lisanium-counter .lisanium-counter-wrap .lisanium-counter-box .counter-item span {
    width: 40px;
    height: 30px;
    font-size: 12px;
}

.swiper.swiper-hero-product .swiper-wrapper {}

.swiper.swiper-hero-product .swiper-wrapper .swiper-slide {}

/* START PRODUCT CARD */

.product-card {
    background-color: var(--color-bg-surface);
    border-radius: 25px;
    overflow: hidden;
    height: 100%;
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
    -webkit-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
    -moz-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
}

.product-card .card-image {
    width: 100%;
    height: auto;
    border-bottom: 1px solid var(--color-border);
}

.product-card .card-image a {
    padding: 15px;
    display: block;
}

.product-card .card-image a img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 15px;
}

.product-card .card-content {}

.product-card .card-content>a {
    padding: 20px;
    display: block;
}

.product-card.mini .card-content>a {
    padding: 15px;
}

.product-card .card-content .card-rating {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 10px;
}

.product-card .card-content .card-rating .stars {
    display: flex;
    align-items: center;
    gap: 2px;
}

.product-card .card-content .card-rating .stars i {
    font-size: 12px;
    line-height: 1;
}

.product-card .card-content .card-rating .rating {
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-muted);
    line-height: 1;
    border-left: 1px solid var(--color-border);
    padding: 0 0 0 10px;
}

.product-card.mini .card-content .card-rating .rating {}

.product-card .card-content .card-title {}

.product-card .card-content .card-title h3 {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    min-height: 50px;
}

.product-card.mini .card-content .card-title h3 {
    font-size: 14px;
    line-height: 18px;
}

.product-card .card-content .card-price {
    display: flex;
    align-items: center;
    gap: 20px;
    row-gap: 10px;
    flex-wrap: wrap;
}

body .price {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

body .price del {
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text-secondary);
    text-decoration: unset;
    position: relative;
    width: fit-content;
    line-height: 1;
}

.product-card.mini .card-content .card-price .price del {
    font-size: 12px;
}

body del::before {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    top: 0;
    background-color: var(--color-text-secondary);
    transform: rotate(-10deg) translate(0, 5px);
}

body .price ins {
    font-size: 20px;
    text-decoration: unset;
    color: var(--color-primary);
    font-weight: 600;
    line-height: 1;
}

.product-card.mini .card-content .card-price .price ins {
    font-size: 18px;
}

.discount {}

.discount .discount-card {
    background-color: var(--color-primary);
    border-radius: 12px;
    line-height: 1;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    padding: 7px;
}

.product-card.mini .card-content .card-price .discount .discount-card {
    padding: 8px 5px;
    border-radius: 10px;
}

.product-card.mini .card-content .card-price .discount .discount-card .value {
    font-size: 12px;
}

.product-card.mini .card-content .card-price .discount .discount-card .label {
    font-size: 10px;
}

.discount .discount-card .value {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-bg-surface);
}

.discount .discount-card .label {
    font-size: 10px;
    font-weight: 300;
    color: var(--color-bg-surface);
}

.product-card.mini .add-to-cart {
    height: 40px;
    font-size: 13px;
}

.product-card.mini .add-to-cart i {
    font-size: 16px;
}

body .add-to-cart {
    background-color: color-mix(in srgb, var(--color-primary), transparent 90%);
    height: 45px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
    border-radius: 15px;
    font-weight: 500;
    font-size: 14px;
    gap: 5px;
}

body .add-to-cart:hover {
    background-color: color-mix(in srgb, var(--color-primary), transparent 0%);
    color: #fff;
}

body .add-to-cart i {
    font-size: 18px;
    line-height: 1;
    position: relative;
    top: -1px;
}

body .add-to-cart span {}

/* END PRODUCT CARD */


/* START PRODUCT SECTION */

.lisanium-product {
    margin: 100px 0 0;
}

.lisanium-product .container {}

.lisanium-product .container .lisanium-head {}

.lisanium-product .container .lisanium-head .head-col {
    display: flex;
    align-items: center;
    gap: 30px;
}

.lisanium-product .container .lisanium-head .head-col h2 {
    border-right: 1px solid var(--color-border);
    padding: 0 30px 0 0;
}

.lisanium-product.same-product .container .lisanium-head .head-col h2 {
    border-right: unset;
    padding: 0;
}

.lisanium-product .container .lisanium-head .head-col h2 span {
    display: block;
    font-weight: 300;
    font-size: 36px;
}

.lisanium-product .container .lisanium-head .head-col p {}

.lisanium-product .container .lisanium-product-wrapper {
    position: relative;
}

.lisanium-product .container .lisanium-product-wrapper .navigation-group {}

.lisanium-product .container .lisanium-product-wrapper .navigation-group button {
    width: 40px;
    height: 40px;
    border-radius: 15px;
    background-color: var(--color-bg-surface);
    border-color: var(--color-bg-surface);
    position: absolute;
    top: 45%;
    transform: translate(0, -50%);
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 8%);
    -webkit-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 8%);
    -moz-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 8%);
}

.lisanium-product .container .lisanium-product-wrapper .navigation-group button i {
    font-size: 16px;
}

.lisanium-product .container .lisanium-product-wrapper .navigation-group button.prev {
    left: -20px;
}

.lisanium-product .container .lisanium-product-wrapper .navigation-group button.next {
    right: -20px;
}

.lisanium-product .container .lisanium-product-wrapper.lisanium-product-banners-wrapper {
    display: flex;
    gap: 20px;
}

.lisanium-product .container .lisanium-product-wrapper.lisanium-product-banners-wrapper .lisanium-product-slider {
    width: 75%;
    position: relative;
}

.lisanium-product .container .lisanium-product-wrapper.lisanium-product-banners-wrapper .swiper {}

.lisanium-product .container .lisanium-product-wrapper.lisanium-product-banners-wrapper .product-banners {
    width: 25%;
}

.swiper.swiper-products {}

.swiper.swiper-products .swiper-wrapper {}

.swiper.swiper-products .swiper-wrapper .swiper-slide {}

.product-banners {}

.product-banners img {
    border-radius: 25px;
}

/* END PRODUCT SECTION */


/* START MEDIA SECTION */

.lisanium-media {
    margin: 100px 0 0;
    position: relative;
}

.lisanium-media .lisanium-media-wrapper {}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col {}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-content {
    position: relative;
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-content::before {
    content: "";
    width: 40%;
    height: 6px;
    bottom: 0;
    left: 0;
    position: absolute;
    background-color: var(--color-primary);
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-content .media-title {
    position: relative;
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-content .media-title::before {
    content: "";
    width: 50%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    border-width: 6px 0 6px 6px;
    border-style: solid;
    border-color: var(--color-primary);
    border-radius: 50px 0 0 50px;
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-content .media-title h2 {
    color: var(--color-secondary);
    font-size: 50px;
    font-weight: 300;
    line-height: 60px;
    padding: 50px;
    margin: 0;
    z-index: 9;
    position: relative;
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-content .media-title h2 strong {
    font-weight: 700;
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-content .media-image-1 {
    position: relative;
    padding: 60px;
    margin: -6px 0 0;
    width: 70%;
    display: flex;
    justify-content: end;
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-content .media-image-1::after {
    content: "";
    width: 60px;
    height: 60px;
    background-image: url(assets/images/part-icon.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    right: -15px;
    top: -15px;
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-content .media-image-1::before {
    content: "";
    width: 50%;
    height: 100%;
    top: 0;
    right: 0;
    position: absolute;
    border-width: 6px 6px 6px 0;
    border-style: solid;
    border-color: var(--color-primary);
    border-radius: 0 50px 50px 0;
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-content .media-image-1 img {
    width: 250px;
}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-image-2 {}

.lisanium-media .lisanium-media-wrapper .lisanium-media-group .lisanium-media-col .media-image-2 img {
    height: 550px;
    object-fit: contain;
}

/* END MEDIA SECTION */


/* START CAMPAIGN PRODUCT SECTION */

.lisanium-campaign-product {
    position: relative;
    padding: 50px 0;
    margin: 100px 0 0;
    overflow: hidden;
}

.lisanium-campaign-product::before {
    content: "";
    background-image: url(assets/images/arkaplan-2.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.lisanium-campaign-product .lisanium-head {}

.lisanium-campaign-product .lisanium-head .head-col {}

.lisanium-campaign-product .lisanium-head .head-col .title {}

.lisanium-campaign-product .lisanium-head .head-col .title h2 {
    color: var(--color-bg-surface);
    font-size: 35px;
    font-weight: 400;
    line-height: 1;
}

.lisanium-campaign-product .lisanium-head .head-col .title h2 strong {}

.lisanium-campaign-product .lisanium-head .head-col .title .icon {}

.lisanium-campaign-product .lisanium-head .navigation-group {}

.lisanium-campaign-product .lisanium-head .navigation-group .swiper-navigation-button {
    border-color: var(--color-bg-surface);
    color: var(--color-bg-surface);
}

.lisanium-campaign-product .lisanium-head .navigation-group .swiper-navigation-button i {}

.lisanium-campaign-product .lisanium-head .navigation-group .swiper-navigation-button:nth-child(even) {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.lisanium-campaign-product .lisanium-head .navigation-group .swiper-navigation-button:nth-child(even) i {}

.lisanium-campaign-product .lisanium-campaign-product-wrapper {}

.swiper.swiper-campaign-product {
    width: 110vw;
}

.swiper.swiper-campaign-product .swiper-wrapper {}

.swiper.swiper-campaign-product .swiper-wrapper .swiper-slide {}

.campaign-product-card {
    background-color: var(--color-bg-surface);
    border-radius: 25px;
    padding: 20px;
}

.campaign-product-card .campaign-product-card-group {}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item {}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item-selection {
    display: flex;
    gap: 15px;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item-selection .lisanium-input-group {
    width: 100%;
    margin: 0;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item-selection .lisanium-input-group select {}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item-selection .custom-add-to-cart {
    height: 45px;
    background-color: var(--color-primary);
    color: var(--color-bg-surface);
    width: 15%;
    border-radius: 50px;
    font-size: 20px;
    display: none;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item-selection .custom-add-to-cart i {}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item {}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item a {
    display: flex;
    align-items: center;
    gap: 20px;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item a .product-card-item-image {
    width: 25%;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item a .product-card-item-image img {
    border-radius: 15px;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item a .product-card-item-content {}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item a .product-card-item-content h3 {
    font-size: 16px;
    font-weight: 500;
    line-height: 18px;
    margin: 0 0 6px;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item a .product-card-item-content .price {
    flex-direction: row;
    align-items: center;
    gap: 10px;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item a .product-card-item-content .price del {
    font-size: 16px;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .product-card-item a .product-card-item-content .price ins {
    font-size: 16px;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .text {
    margin: 15px 0;
}

.campaign-product-card .campaign-product-card-group .campaign-product-card-item .text p {
    font-size: 13px;
    font-weight: 400;
    line-height: 17px;
}

/* END CAMPAIGN PRODUCT SECTION */


/* START BLOG */

.lisanium-blog {
    margin: 100px 0 0;
}

.lisanium-blog .lisanium-head {
    text-align: left;
    margin: 0 0 40px;
}

.lisanium-blog .lisanium-head .head-col {
    display: flex;
    align-items: center;
    gap: 30px;
}

.lisanium-blog .lisanium-head .head-col h2 {
    border-right: 1px solid var(--color-border);
    padding: 0 30px 0 0;
}

.lisanium-blog .lisanium-head .head-col h2 span {
    display: block;
    font-weight: 300;
    font-size: 36px;
}

.lisanium-blog .lisanium-head .head-col p {
    margin: 0;
    font-size: 14px;
}

.lisanium-blog .lisanium-blog-wrapper {}

.lisanium-blog .lisanium-blog-wrapper .lisanium-blog-part {}

.swiper.swiper-blog {}

.swiper.swiper-blog .swiper-wrapper {}

.swiper.swiper-blog .swiper-wrapper .swiper-slide {}


.blog-card {
    position: relative;
    margin: 0 0 25px;
    display: block;
}

.blog-card .card-image {}

.blog-card .card-image img {}

.blog-card .card-content {
    max-width: 80%;
    margin: 20px 0 0;
}

.blog-card .card-content .date {
    color: var(--color-text-muted);
    font-size: 12px;
    line-height: 1;
    position: relative;
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 0 0 10px;
}

.blog-card .card-content .date::before {
    content: "";
    width: 15px;
    height: 1px;
    background-color: var(--color-text-muted);
    display: block;
    position: relative;
    top: -1px;
}

.blog-card .card-content h3 {
    font-size: 18px;
    line-height: 24px;
    font-weight: 500;
    margin: 0 0 10px;
}

.blog-card .card-content .blog-button {
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
}

.blog-card .card-content .blog-button i {
    font-size: 18px;
    line-height: 1;
    position: relative;
    top: -1px;
}

.blog-card .card-content p {
    font-size: 13px;
    line-height: 20px;
}

.blog-card .card-content .lisanium-button {
    background-color: #ebebeb80;
    height: 45px;
    padding: 0 25px;
}

.blog-card .card-content .lisanium-button img {}

/* END BLOG */


/* START FETAURES */

.lisanium-features {
    margin: 75px 0 0;
}

.lisanium-features .lisanium-features-wrapper {}

.lisanium-features .lisanium-features-wrapper .row {}

.lisanium-features-card {
    display: flex;
    align-items: center;
    gap: 15px;
}

.lisanium-features-card .icon {
    background-color: color-mix(in srgb, var(--color-primary), transparent 92%);
    border-radius: 18px;
    width: 70px;
    min-width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
}

.lisanium-features-card .icon img {
    width: 35px;
}

.lisanium-features-card .content {}

.lisanium-features-card .content .title {
    color: var(--color-secondary);
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    margin: 0 0 5px;
}

.lisanium-features-card .content p {
    color: var(--color-text-secondary);
    font-size: 14px;
    font-weight: 300;
    line-height: 18px;
}

/* END FETAURES */


/* START FOOTER */

.lisanium-footer {
    margin: 100px 0 0;
    position: relative;
    overflow: hidden;
}

.lisanium-footer .lisanium-footer-logos {
    position: relative;
}

.lisanium-footer .lisanium-footer-logos .logos-group {
    display: flex;
    gap: 20px;
    justify-content: center;
    border-top: 1px solid #EEEEEE;
    padding: 50px 0;
}

.lisanium-footer .lisanium-footer-logos .logos-group img {
    height: 50px;
    width: fit-content;
}

.lisanium-footer .lisanium-footer-logos .logos-group img:not(:last-child) {
    border-right: .5px solid #000;
    padding-right: 20px;
}

.lisanium-footer .lisanium-footer-logos img.shapes {
    position: absolute;
    left: 50%;
    top: -100%;
    transform: translate(-50%, 0);
    width: 120%;
    z-index: -1;
}

.lisanium-footer-main {
    position: relative;
    z-index: 9;
}

.lisanium-footer-main .lisanium-footer-logo {
    display: flex;
    justify-content: center;
    position: relative;
}

.lisanium-footer-main .lisanium-footer-logo::before {
    content: "";
    position: absolute;
    width: 40%;
    left: 50%;
    top: 100%;
    transform: translate(-100%, 20px);
    border-width: 0 1px 1px 0;
    border-style: solid;
    border-color: var(--color-border-strong);
    height: 100px;
    border-radius: 0 0 50px;
}

.lisanium-footer-main .lisanium-footer-logo::after {
    content: "";
    position: absolute;
    width: 40%;
    right: 50%;
    top: 100%;
    transform: translate(99.9%, 20px);
    border-width: 0 0 1px 1px;
    border-style: solid;
    border-color: var(--color-border-strong);
    height: 100px;
    border-radius: 0 0 0 50px;
}

.lisanium-footer-main .lisanium-footer-logo a {}

.lisanium-footer-main .lisanium-footer-logo a img {
    width: 200px;
    object-fit: contain;
}

.lisanium-footer-main .lisanium-footer-menus-group {
    padding: 120px 0 0;
}

.lisanium-footer-main .lisanium-footer-menus-group .row {}

.lisanium-footer-main .lisanium-footer-menus-group .row .col {}

.lisanium-footer-main .lisanium-footer-menus-group .row .col:nth-child(-n+2) {}

.lisanium-footer-main .lisanium-footer-menus-group .row .col:nth-child(-n+2) .footer-menu-item {}

.lisanium-footer-main .lisanium-footer-menus-group .row .col:nth-child(-n+2) .footer-menu-item::before {}

.lisanium-footer-main .lisanium-footer-menus-group .row .col:nth-last-child(-n+2) {}

.lisanium-footer-main .lisanium-footer-menus-group .row .col:nth-last-child(-n+2) .footer-menu-item {
    text-align: end;
    padding: 90px 50px 0 0;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col:nth-last-child(-n+2) .footer-menu-item::before {
    border-width: 1px 1px 0 0;
    border-radius: 0 35px 0 0;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item {
    position: relative;
    padding: 90px 0 0 50px;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item::before {
    content: "";
    position: absolute;
    width: 50%;
    left: 50%;
    top: -1px;
    transform: translate(-50%, 0px);
    border-width: 1px 0 0 1px;
    border-style: solid;
    border-color: var(--color-border-strong);
    height: 75px;
    border-radius: 35px 0 0 0;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .title {
    color: var(--color-secondary);
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 15px;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .menu-content {}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .menu-content ul {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .menu-content.contact ul {
    align-items: flex-end;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .menu-content ul li {}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .menu-content ul li a {
    color: #2B2B2B;
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    display: block;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .menu-content.contact ul li a {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .menu-content ul li a:hover {
    opacity: .4;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .menu-content ul li a .icon {
    background-color: color-mix(in srgb, var(--color-primary), transparent 92%);
    border-radius: 12px;
    width: 40px;
    min-width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .menu-content ul li a .icon img {
    width: 20px;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .catalog-group {
    display: flex;
    gap: 15px;
}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .catalog-group a {}

.lisanium-footer-main .lisanium-footer-menus-group .row .col .footer-menu-item .catalog-group a img {
    height: 125px;
    width: auto;
    object-fit: cover;
}

.footer-contact {}

.footer-contact .address {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 40px;
}

.footer-contact .address .icon {}

.footer-contact .address .icon img {
    width: 25px;
}

.footer-contact .address .content {
    line-height: 1;
}

.footer-contact .address .content .text {
    font-size: 16px;
    color: #fff;
    font-weight: 400;
    line-height: 1;
    margin: 0 0 6px;
}

.footer-contact .address .content .label {
    font-size: 12px;
    color: #fff;
    letter-spacing: .2px;
}

.footer-contact .footer-contact-button {
    display: flex;
    height: 50px;
    margin: 0 0 10px;
}

.footer-contact .footer-contact-button.help {
    background-color: #F2F2F2;
}

.footer-contact .footer-contact-button.help .icon {
    background-color: #fff;
}

.footer-contact .footer-contact-button.help .text {
    color: #1858A5;
}

.footer-contact .footer-contact-button.call {
    border: .5px solid #fff;
}

.footer-contact .footer-contact-button.call:hover {
    border-color: transparent;
}

.footer-contact .footer-contact-button.call .icon {
    border-right: .5px solid #fff;
}

.footer-contact .footer-contact-button.call .text {
    color: #fff;
}

.footer-contact .footer-contact-button .icon {
    width: 50px;
    min-width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-contact .footer-contact-button .icon img {
    width: 24px;
}

.footer-contact .footer-contact-button .text {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.lisanium-footer-copyright {
    background-color: color-mix(in srgb, var(--color-primary), transparent 92%);
    padding: 10px 0;
    margin: 100px 0 0;
    position: relative;
    z-index: 9;
}

.lisanium-footer-copyright .lisanium-footer-copyright-group {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.lisanium-footer-copyright .lisanium-footer-copyright-group .copyright-col {}

.lisanium-footer-copyright .lisanium-footer-copyright-group .copyright-col .image {}

.lisanium-footer-copyright .lisanium-footer-copyright-group .copyright-col .image img {
    height: 20px;
    object-fit: contain;
}

.lisanium-footer-copyright .lisanium-footer-copyright-group .copyright-col p {
    color: var(--color-secondary);
    font-size: 14px;
    line-height: 1;
    font-weight: 400;
}

.lisanium-footer-copyright .lisanium-footer-copyright-group .copyright-col p strong {}

.lisanium-footer-copyright .lisanium-footer-copyright-group .copyright-col a.powered {}

.lisanium-footer-copyright .lisanium-footer-copyright-group .copyright-col a.powered img {
    height: 15px;
}

/* END FOOTER */


/* START PAGE HEAD */

.lisanium-page-head {}

.lisanium-page-head .page-head-wrapper {
    display: flex;
    justify-content: end;
}

.lisanium-page-head .page-head-wrapper .page-head-image {
    width: 85%;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.lisanium-page-head.full .page-head-wrapper .page-head-image {
    width: 95%;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.lisanium-page-head .page-head-wrapper .page-head-image img {
    border-radius: 30px;
    height: 400px;
    object-fit: cover;
}

/* END PAGE HEAD */


/* START CATEGORY */

.lisanium-category {
    margin: 60px 0 0;
}

.lisanium-category .lisanium-category-wrapper {}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head {
    display: flex;
    gap: 50px;
}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item {}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item:nth-child(1) {
    width: 25%;
}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item:nth-child(2) {
    width: 32.5%;
}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item:nth-child(3) {
    width: 32.5%;
}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item .breadcrumb {}

body .breadcrumb {
    margin: 0;
}

body .breadcrumb ul {
    display: flex;
    align-items: center;
    gap: 5px;
}

body .breadcrumb ul li {
    line-height: 1;
    font-size: 14px;
    color: var(--color-text-secondary);
    font-weight: 300;
}

body .breadcrumb ul li a {
    color: var(--color-secondary);
    font-weight: 500;
}

body .breadcrumb ul li:not(:last-child) {}

body .breadcrumb ul li:not(:last-child) a {}

body .breadcrumb ul li:not(:last-child) a::after {
    content: "/";
}

body .breadcrumb ul li a i {
    font-size: 16px;
    line-height: 1;
    position: relative;
    top: 0;
}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item .category-info-content {}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item .category-info-content h2 {
    font-size: 14px;
    color: var(--color-primary);
    font-weight: 500;
    line-height: 1;
    margin: 0;
}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item .category-info-content span {
    color: var(--color-text-secondary);
    font-size: 14px;
    font-weight: 300;
}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item .category-info-content span strong {
    font-weight: 500;
}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item .category-orderby {}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item .category-orderby .lisanium-input-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item .category-orderby .lisanium-input-group label {
    color: var(--color-text-secondary);
    font-size: 14px;
    font-weight: 300;
    display: block;
    width: 55px;
}

.lisanium-category .lisanium-category-wrapper .lisanium-category-head .category-head-item .category-orderby .lisanium-input-group .ss-main {
    border: unset;
}

.lisanium-category-body {}

.lisanium-category-body .lisanium-category-app {
    display: flex;
    gap: 50px;
}

.lisanium-category-body .lisanium-category-app .lisanium-category-app-side {
    width: 25%;
}

.lisanium-category-aside {}

.lisanium-category-aside .lisanium-category-aside-wrapper {}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item {}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item:not(:last-child) {
    margin: 0 0 40px;
}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item:nth-child(odd) {
    border-left: 1px solid var(--color-border-strong);
    padding: 10px 0 10px 20px;
}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item .lisanium-category-aside-item-head {}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item .lisanium-category-aside-item-head .title {
    font-size: 20px;
    font-weight: 500;
    line-height: 1;
    margin: 0 0 20px;
}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item .lisanium-category-aside-item-body {}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item .lisanium-category-aside-item-body .lisanium-category-aside-price {
    display: flex;
    gap: 20px;
}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item .lisanium-category-aside-item-body .lisanium-category-aside-price .lisanium-input-group {
    flex: 1;
}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item .lisanium-category-aside-item-body .lisanium-category-aside-price .lisanium-input-group label {}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item .lisanium-category-aside-item-body .lisanium-category-aside-price .lisanium-input-group input {
    background-color: color-mix(in srgb, var(--color-primary), transparent 92%);
    border-radius: 15px;
    height: 45px;
    font-size: 14px;
}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item .lisanium-category-aside-item-body .lisanium-category-aside-price .lisanium-input-group input::placeholder {
    color: var(--color-primary);
}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item .lisanium-category-aside-item-body .lisanium-category-aside-item-list {}

.lisanium-category-aside .lisanium-category-aside-wrapper .lisanium-category-aside-item .lisanium-category-aside-item-body .lisanium-category-aside-item-list .lisanium-category-aside-item-list-item {
    margin: 0 0 12px;
}

.lisanium-checkbox {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

.lisanium-checkbox>input {
    width: 16px;
    height: 16px;
    position: relative;
    appearance: unset;
}

.lisanium-checkbox>input::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    border: 1px solid var(--color-border-strong);
    border-radius: 5px;
}

.lisanium-checkbox>input:checked {}

.lisanium-checkbox>input:checked::before {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.lisanium-checkbox label {
    line-height: 1;
    font-size: 14px;
    color: var(--color-text-muted);
    display: flex;
    align-items: center;
    gap: 10px;
}

.lisanium-checkbox label span {}

.lisanium-checkbox .stars {
    display: flex;
    align-items: center;
    gap: 3px;
}

.lisanium-checkbox .stars .star {
    width: 12px;
    height: 12px;
    position: relative;
    background-image: url(assets/images/yildiz.svg);
    background-position: center;
    background-size: contain;
}

.lisanium-checkbox .stars .star::before {
    content: "";
}

.lisanium-category-body .lisanium-category-app .lisanium-category-app-list {
    width: 75%;
}

.lisanium-category-body .lisanium-category-app .lisanium-category-app-list .lisanium-category-main {}

.lisanium-category-body .lisanium-category-app .lisanium-category-app-list .lisanium-category-main .lisanium-category-main-list {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 30px;
}

.lisanium-category-body .lisanium-category-app .lisanium-category-app-list .lisanium-category-main .lisanium-category-main-list .lisanium-category-main-item {}

/* END CATEGORY */


/* START CONTENT */

.lisanium-content {
    margin: 100px 0 0;
}

.lisanium-content .lisanium-content-wrapper {}

.lisanium-content .lisanium-content-wrapper .lisanium-content-card {
    background-color: var(--color-bg-surface);
    border-radius: 25px;
    overflow: hidden;
    height: 100%;
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
    -webkit-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
    -moz-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
    padding: 30px;
}

.lisanium-content .lisanium-content-wrapper .lisanium-content-card .lisanium-content-card-main {
    height: 190px;
    overflow: hidden;
}

.lisanium-content .lisanium-content-wrapper .lisanium-content-card .lisanium-content-card-main h2 {
    font-size: 24px;
    font-weight: 500;
    line-height: 30px;
    margin: 20px 0 10px;
}

.lisanium-content .lisanium-content-wrapper .lisanium-content-card .lisanium-content-card-main p {
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
}

.lisanium-content .lisanium-content-wrapper .lisanium-content-card .lisanium-content-card-action {
    margin: 20px 0 0;
}

.lisanium-content .lisanium-content-wrapper .lisanium-content-card .lisanium-content-card-action .lisanium-button {}

.lisanium-content .lisanium-content-wrapper .lisanium-content-card .lisanium-content-card-action .lisanium-button span {}

/* END CONTENT */


/* START PRODUCT PAGE */

.lisanium-product-page {}

.lisanium-product-page .product-page-wrapper {
    display: flex;
    justify-content: end;
}

.lisanium-product-page .product-page-wrapper .product-page-group {
    display: flex;
    gap: 50px;
    width: 85%;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.lisanium-product-page.full .product-page-wrapper .product-page-group {
    width: 95%;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.lisanium-product-page .product-page-wrapper .product-page-group .product-page-col {
    width: 50%;
}

.product-page-media {}

.swiper.swiper-product-media {}

.swiper.swiper-product-media .swiper-wrapper {}

.swiper.swiper-product-media .swiper-wrapper .swiper-slide {}

.swiper.swiper-product-media .swiper-wrapper .swiper-slide a {
    display: block;
}

.swiper.swiper-product-media .swiper-wrapper .swiper-slide a img {
    border-radius: 25px;
}

.product-page-media .product-page-feature-comments {
    background-color: var(--color-bg-surface);
    border-width: 0 1px 1px 1px;
    border-style: solid;
    border-color: var(--color-border-strong);
    border-radius: 0 0 30px 30px;
    padding: 15px;
    position: relative;
}

.product-page-media .product-page-feature-comments::before {
    content: "";
    position: absolute;
    bottom: 99%;
    left: 0;
    height: 100px;
    width: 100%;
    background-color: var(--color-bg-surface);
    outline-width: 1px;
    outline-color: var(--color-border-strong);
    outline-style: solid;
    z-index: -1;
}

.product-page-media .product-page-feature-comments .feature-comments-wrapper {}

.product-page-media .product-page-feature-comments .feature-comments-wrapper .feature-comments-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 10px;
}

.product-page-media .product-page-feature-comments .feature-comments-wrapper .feature-comments-head span {
    color: var(--color-text-muted);
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
}

.product-page-media .product-page-feature-comments .feature-comments-wrapper .feature-comments-head span::before {
    content: "";
}

.product-page-media .product-page-feature-comments .feature-comments-wrapper .feature-comments-head .navigation-group {
    gap: 10px;
}

.product-page-media .product-page-feature-comments .feature-comments-wrapper .feature-comments-head .navigation-group .swiper-navigation-button {
    width: 35px;
    height: 35px;
    border-radius: 13px;
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-bg-surface);
}

.product-page-media .product-page-feature-comments .feature-comments-wrapper .feature-comments-head .navigation-group .swiper-navigation-button i {
    font-size: 16px;
}

.product-page-media .product-page-feature-comments .feature-comments-wrapper .feature-comments-main {}

.swiper.swiper-feature-comments {}

.swiper.swiper-feature-comments .swiper-wrapper {}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide {}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide .feature-comments-card {
    display: flex;
    align-items: center;
    gap: 15px;
}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide .feature-comments-card .profil {
    width: 10%;
}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide .feature-comments-card .profil img {
    width: 50px;
    height: 50px;
    object-fit: contain;
}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide .feature-comments-card .name-main {
    width: 18%;
}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide .feature-comments-card .name-main .stars {
    display: flex;
    align-items: center;
    gap: 1px;
    margin: 0 0 5px;
}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide .feature-comments-card .name-main .stars i {
    font-size: 12px;
}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide .feature-comments-card .name-main .stars .star {}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide .feature-comments-card .name-main .name-text {
    color: var(--color-secondary);
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide .feature-comments-card .comment-main {
    width: 72%;
}

.swiper.swiper-feature-comments .swiper-wrapper .swiper-slide .feature-comments-card .comment-main p {
    color: var(--color-text-muted);
    font-size: 12px;
}


.product-page-card {}

.product-page-card .card-rating {
    gap: 20px;
    display: flex;
    align-items: center;
    line-height: 1;
    margin: 0 0 20px;
}

.product-page-card .card-rating .stars {
    display: flex;
    align-items: center;
    gap: 2px;
}

.product-page-card .card-rating .stars i {
    font-size: 14px;
}

.product-page-card .card-rating .rating {}

.product-page-card .card-rating .rating button {
    font-size: 11px;
    height: 35px;
    padding: 0 12px;
    background-color: color-mix(in srgb, var(--color-primary), transparent 92%);
    color: var(--color-primary);
    border: unset;
}

.product-page-card .card-rating .rating button i {
    font-size: 14px;
}

.product-page-card .card-content {}

.product-page-card .card-content h1 {
    font-size: 30px;
    font-weight: 500;
}

.product-page-card .card-content p {
    color: var(--color-text-muted);
    font-size: 14px;
}

.product-page-card .card-item {}

.product-page-card .card-item:not(:last-child) {
    margin: 0 0 30px;
}

.product-page-card .card-feature {}

.product-page-card .card-title {
    color: var(--color-secondary);
    font-size: 15px;
    font-weight: 600;
    margin: 0 0 10px;
}

.card-feature .card-feature-list {
    position: relative;
    margin: 0 0 15px;
}

.card-feature .card-feature-list::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background: var(--color-bg-body);
    background: -moz-linear-gradient(180deg, color-mix(in srgb, var(--color-bg-body), transparent 92%) 0%, var(--color-bg-body) 102%);
    background: -webkit-linear-gradient(180deg, color-mix(in srgb, var(--color-bg-body), transparent 92%) 0%, var(--color-bg-body) 100%);
    background: linear-gradient(180deg, color-mix(in srgb, var(--color-bg-body), transparent 92%) 0%, var(--color-bg-body) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="var(--color-bg-surface)fff", endColorstr="#000000", GradientType=1);
}

.card-feature .card-feature-list ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.card-feature .card-feature-list ul li {}

.card-feature .card-feature-list ul li span {
    font-size: 14px;
    color: var(--color-text-muted);
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 5px;
}

.card-feature .card-feature-list ul li span::before {
    content: "";
    background-image: url(assets/images/tik.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 22px;
    height: 22px;
    display: block;
}

.product-page-card .card-feature .card-feature-button {}

.product-page-card .lisanium-button {
    color: var(--color-secondary);
    background-color: transparent;
    border: 1px solid var(--color-border);
    font-size: 12px;
    height: 38px;
    padding: 0 10px;
}

.product-page-card .lisanium-button i {
    font-size: 14px;
    top: 0;
}

.product-page-card .card-price {
    display: flex;
    align-items: center;
    gap: 20px;
}

.product-page-card .card-price .price {}

.product-page-card .card-price .price del {
    font-size: 18px;
}

.product-page-card .card-price .price ins {
    font-size: 26px;
}

.product-page-card .card-price .discount {}

.product-page-card .card-price .discount .discount-card {
    padding: 0;
    width: 50px;
    height: 50px;
}

.product-page-card .card-price .discount .discount-card .value {
    font-size: 16px;
}

.product-page-card .card-price .discount .discount-card .label {
    font-size: 12px;
}

.product-page-card .card-price .card-quantity {}

.product-page-card .card-price .card-quantity label {}

.product-page-card .card-price .card-quantity .cart-update {}

.product-page-card .card-price .card-quantity .lisanium-counter {
    margin: 0;
    border-radius: 15px;
    background-color: var(--color-bg-surface);
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 5%);
    -webkit-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 5%);
    -moz-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 5%);
    padding: 0 10px;
    height: 50px;
}

.product-page-card .card-price .card-quantity .lisanium-counter .lisanium-counter-group {}

.product-page-card .card-price .card-quantity .lisanium-counter .lisanium-counter-group .counter-button {}

.product-page-card .card-price .card-quantity .lisanium-counter .lisanium-counter-group .counter-button i {}

.product-page-card .card-price .card-quantity .lisanium-counter .lisanium-counter-group #counterInput {}

.product-page-card .card-price .add-to-cart {
    height: 50px;
}

.product-page-card .card-price .add-to-cart i {}

.product-page-card .card-price .add-to-cart span {}

body .lisanium-counter {
    background-color: rgb(48 52 255 / 5%);
    padding: 8px;
    border-radius: 50px;
}

body .lisanium-counter .lisanium-counter-group {
    display: flex;
}

body .lisanium-counter .lisanium-counter-group button {
    width: 25px;
    height: 25px;
    color: var(--color-primary);
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

body .lisanium-counter .lisanium-counter-group button i {
    font-size: 18px;
}

body .lisanium-counter .lisanium-counter-group button input {}

body .lisanium-counter .lisanium-counter-group input {
    border: unset;
    background-color: unset;
    width: 40px;
    text-align: center;
    padding: 0 0 0 10px;
    font-size: 16px;
    color: var(--color-secondary);
    font-weight: 600;
}

.lisanium-product-tab {}

.lisanium-product-tab .product-tab-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 50px 0;
}

.lisanium-product-tab .product-tab-head .product-tab-head-col {}

.lisanium-product-tab .product-tab-head .product-tab-head-col .product-tab-head-contact {
    display: flex;
    align-items: center;
    gap: 40px;
}

.lisanium-product-tab .product-tab-head .product-tab-head-col .product-tab-head-contact a {
    font-size: 20px;
    font-weight: 500;
    position: relative;
}

.lisanium-product-tab .product-tab-head .product-tab-head-col .product-tab-head-contact a.tg {
    color: var(--color-primary);
}

.lisanium-product-tab .product-tab-head .product-tab-head-col .product-tab-head-contact a.wp {
    color: #009E20;
}

.lisanium-product-tab .product-tab-head .product-tab-head-col .product-tab-head-contact a:not(:first-child) {}

.lisanium-product-tab .product-tab-head .product-tab-head-col .product-tab-head-contact a:not(:first-child)::before {
    content: "";
    width: 1px;
    height: 30px;
    position: absolute;
    top: 50%;
    left: -20px;
    transform: translate(0, -50%);
    background-color: var(--color-border-strong);
}

.lisanium-product-tab .product-tab-head .product-tab-head-col .product-tab-head-contact a i {
    font-size: 24px;
}

.lisanium-product-tab .product-tab-head .product-tab-head-col .product-tab-head-action {
    display: flex;
    align-items: center;
    gap: 20px;
}

.lisanium-product-tab .product-tab-head .product-tab-head-col .product-tab-head-action .lisanium-button {
    color: var(--color-secondary);
    border-radius: 15px;
    padding: 0 20px;
}

.lisanium-product-tab .product-tab-head .product-tab-head-col .product-tab-head-action .lisanium-button:nth-child(even) {
    background-color: var(--color-primary);
    color: #fff;
}

.lisanium-product-general {}

.lisanium-product-general .lisanium-product-general-wrap {
    border-radius: 30px;
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 5%);
    -webkit-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 5%);
    -moz-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 5%);
    background-color: var(--color-bg-surface);
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-filter {
    width: 100%;
    padding: 40px 40px 0;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-filter .general-filter-list {
    display: flex;
    gap: 10px;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-filter .general-filter-list .tab-button {
    color: var(--color-text-muted);
    font-size: 14px;
    padding: 12px 20px;
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1) 0s;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-filter .general-filter-list .tab-button:last-child {
    border-bottom: 0;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-filter .general-filter-list .tab-button span {
    position: relative;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-filter .general-filter-list .tab-button.active {
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1) 0s;
    background-color: color-mix(in srgb, var(--color-primary), transparent 90%);
    color: var(--color-primary);
    border-radius: 12px;
    font-weight: 500;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-filter .general-filter-list .tab-button i {
    font-size: 20px;
    line-height: 1;
    position: relative;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-tabs {
    width: 80%;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-tabs .product-general-tab-item {
    display: none;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-tabs .product-general-tab-item .product-general-content-wrap {
    padding: 40px;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-tabs .product-general-tab-item .product-general-content-wrap h2 {
    font-size: 28px;
    font-weight: 600;
    line-height: 38px;
}

.lisanium-product-general .lisanium-product-general-wrap .product-general-tabs .product-general-tab-item .product-general-content-wrap p {
    color: #868686;
    font-size: 14px;
    font-weight: 300;
    line-height: 24px;
}

.lisanium-product-page-campaign {
    margin: 75px 0 0;
}

.lisanium-product-page-campaign .lisanium-head {
    justify-content: center;
}

.lisanium-product-page-campaign .lisanium-head .head-col {
    display: flex;
    align-items: center;
    gap: 30px;
}

.lisanium-product-page-campaign .lisanium-head .head-col h2 {
    border-right: 1px solid var(--color-border);
    padding: 0 30px 0 0;
}

.lisanium-product-page-campaign .lisanium-head .head-col h2 span {
    display: block;
    font-weight: 300;
    font-size: 36px;
}

.lisanium-product-page-campaign .lisanium-head .head-col p {}

.lisanium-product-page-campaign .product-page-campaign-wrapper {
    display: flex;
    gap: 50px;
}

.lisanium-product-page-campaign .product-page-campaign-wrapper .product-page-campaign-col {
    width: 50%;
}

.product-page-campaign-card {}

.product-page-campaign-card .card-head {
    background-color: color-mix(in srgb, var(--color-primary), transparent 95%);
    border-radius: 20px 20px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 15px 0;
    line-height: 1;
}

.product-page-campaign-card .card-head::before {
    content: "";
    width: 100%;
    height: 100px;
    position: absolute;
    top: 100%;
    left: 0;
    background-color:
        color-mix(in srgb, var(--color-primary), transparent 95%);
}

.product-page-campaign-card .card-head .title {
    color: var(--color-secondary);
    font-size: 16px;
}

.product-page-campaign-card .card-head .title strong {}

.product-page-campaign-card .card-body {}

.product-page-campaign-card .card-body .product-page-campaign-box-group {
    display: flex;
    justify-content: space-between;
    background-color: var(--color-bg-surface);
    overflow: hidden;
    height: 100%;
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
    -webkit-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
    -moz-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 2%);
    padding: 25px;
    border-radius: 25px;
    z-index: 9;
    position: relative;
}

.product-page-campaign-card .card-body .product-page-campaign-box-group::before {
    content: "+";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    background-color: var(--color-primary);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-bg-surface);
    font-size: 35px;
    line-height: 1;
}

.product-page-campaign-card .card-body .product-page-campaign-box-group .product-page-campaign-box {
    width: 40%;
}

.product-page-campaign-box {}

.product-page-campaign-box .box-image {}

.product-page-campaign-box .box-image img {
    border-radius: 20px;
}

.product-page-campaign-box .box-content {
    padding: 10px 0 0;
}

.product-page-campaign-box .box-content .lisanium-input-group {}

.product-page-campaign-box .box-content .lisanium-input-group .ss-main {
    font-size: 12px;
    height: 40px;
    padding: 0 15px;
}

.product-page-campaign-box .box-content .text {
    font-size: 14px;
    text-decoration: unset;
    color: var(--color-primary);
    font-weight: 600;
    line-height: 1;
}

.product-page-campaign-box .box-content .stars {
    display: flex;
    align-items: center;
    gap: 2px;
}

.product-page-campaign-box .box-content .stars i {
    font-size: 12px;
}

.product-page-campaign-box .box-content .name {
    font-size: 15px;
    font-weight: 400;
}

.product-page-campaign-box .box-content .price {
    margin: 10px 0 0;
}

.product-page-campaign-box .box-content .price del {}

.product-page-campaign-box .box-content .price ins {}

.product-page-campaign-feature {}

.product-page-campaign-feature .feature-head {
    display: flex;
    justify-content: end;
    margin: 0 0 30px;
}

.product-page-campaign-feature .feature-head h3 {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 22px;
    color: var(--color-secondary);
    font-weight: 500;
    line-height: 1;
}

.product-page-campaign-feature .feature-head h3 .icon {
    background-color: color-mix(in srgb, var(--color-primary), transparent 92%);
    border-radius: 12px;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease;
}

.product-page-campaign-feature .feature-head h3 .icon i {
    font-size: 22px;
    transform: rotate(-10deg);
    color: var(--color-secondary);
}

.product-page-campaign-feature .feature-head h3 span {}

.product-page-campaign-feature .feature-body {}

.product-page-campaign-feature .feature-body .feature-list {}

.product-page-campaign-feature .feature-body .feature-list ul {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.product-page-campaign-feature .feature-body .feature-list ul li {
    background-color: var(--color-bg-surface);
    text-align: end;
    padding: 15px;
    border-radius: 15px;
}

.product-page-campaign-feature .feature-body .feature-list ul li span {
    color: var(--color-text-muted);
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: flex-end;
}

.product-page-campaign-feature .feature-body .feature-list ul li span::after {
    content: "";
    background-image: url(assets/images/tik-2.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 22px;
    height: 22px;
    display: block;
}

.product-page-campaign-feature .feature-body .feature-list ul li span strong {}

/* END PRODUCT PAGE */


.search-action {}

.search-action img {
    width: 24px;
}

.search-action svg {
    width: 24px;
    height: 24px;
    stroke: var(--color-bg-surface);
}

.search-action i {
    color: var(--color-bg-surface);
    font-size: 30px;
    line-height: 1;
    font-weight: 100;
    position: relative;
    top: 5px;
    display: none;
}

.search-action svg path {}

.links-group {
    display: flex;
    align-items: center;
    gap: 15px;
}

body .lisanium-button {
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 15px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    width: fit-content;
    line-height: 1;
    gap: 5px;
    background-color: color-mix(in srgb, var(--color-primary), transparent 90%);
    color: var(--color-primary);
}

body .lisanium-button:hover {
    background-color: var(--color-secondary) !important;
    border-color: var(--color-secondary) !important;
    color: var(--color-bg-surface) !important;
}

body .lisanium-button.transparent {
    background-color: var(--color-bg-surface)fff52;
}

body .lisanium-button img {
    width: 20px;
    margin: 0 0 3px;
}

body .lisanium-button i {
    font-size: 18px;
    position: relative;
    top: -1px;
}

.lisanium-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 30px;
    width: 100%;
    z-index: 9;
    position: relative;
}

.lisanium-head .head-col {}

.lisanium-head .subtitle {}

.lisanium-head h3 {}

.lisanium-head h2 {
    color: var(--color-secondary);
    font-size: 45px;
    font-weight: 600;
    display: block;
    line-height: 52px;
    margin: 0;
}

.lisanium-head h2 strong {}

.lisanium-head .title {
    display: flex;
    align-items: center;
    gap: 20px;
}

.lisanium-head .title .icon {
    background-color: var(--color-secondary);
    width: 55px;
    height: 55px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-bg-surface);
    font-size: 30px;
    font-weight: 600;
}

.lisanium-head p {
    color: var(--color-text-secondary);
    font-size: 14px;
    font-weight: 400;
    max-width: 50%;
    line-height: 18px;
}

.lisanium-head .lisanium-head-col {
    display: block;
}

.lisanium-head a {
    padding: 0 30px;
}

.lisanium-head a i {
    line-height: 1;
}

.head-filter {}

.head-filter .filter-group {
    display: flex;
    gap: 20px;
}

.head-filter .filter-group a {
    height: 40px;
    border: .5px solid #000;
    border-radius: 45px;
    font-size: 13px;
    font-weight: 400;
    padding: 0px 25px;
}

.head-filter .filter-group a:hover {
    background-color: #1858A5;
    border-color: #1858A5;
    color: var(--color-bg-surface);
}

.head-filter .filter-group a.active {
    background-color: #1858A5;
    border-color: #1858A5;
    color: var(--color-bg-surface);
}

.navigation-group {
    display: flex;
    align-items: center;
    gap: 20px;
}

.swiper-navigation-button {
    width: 55px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99;
    border: 2px solid var(--color-secondary);
    color: var(--color-secondary);
    border-radius: 20px;
}

.swiper-navigation-button.swiper-button-disabled {}

.swiper-navigation-button.swiper-button-disabled i {
    opacity: .2;
}

.swiper-navigation-button img {
    width: 35px;
}

.swiper-navigation-button i {
    line-height: 1;
    font-size: 22px;
    font-weight: 100;
}

body .swiper {
    display: none;
}

body .swiper.swiper-horizontal,
body .swiper.swiper-vertical {
    display: block;
}



/** START HEAD SUB MENU  **/

.sub-head-menu {
    position: absolute;
    left: 50%;
    top: 80%;
    width: 60%;
    transform: translate(-50%, 0);
    display: none;
    z-index: 99;
}

.sub-head-menu.active {
    appearance: auto;
    opacity: 1;
    transform: translate(0, 0);
    display: block;
    transition: all .4s ease;
    z-index: 999;
}

.sub-head-menu .sub-head-menu-wrapper {
    background-color: #FAFAFA;
    margin: 27px 0 0;
    border-radius: 0 0 50px 50px;
}

.sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    align-items: flex-start;
}

.sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list {
    padding: 40px;
}

header.lisanium-header .lisanium-head-main .sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list ul {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
}

.sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list ul li {
    display: block;
    width: 30%;
}

.sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list ul li:not(:last-child) {}

header.lisanium-header .lisanium-head-main .sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list ul li a {
    color: #000 !important;
    display: flex;
    align-items: center;
    font-weight: 400;
    height: auto;
    font-size: 15px;
}

header.lisanium-header .lisanium-head-main .sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list ul li a i {
    font-size: 15px;
    line-height: 1;
    margin: 0 6px 0 0;
}

header.lisanium-header .lisanium-head-main .sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list ul li a.active {
    color: #6CA7DB !important;
}

header.lisanium-header .lisanium-head-main .sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list ul li a.active i {
    transform: rotate(90deg);
}

header.lisanium-header .lisanium-head-main .sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list .sub-child-menu {
    margin: 15px 0 5px 20px;
    display: none;
}

header.lisanium-header .lisanium-head-main .sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list .sub-child-menu ul {
    gap: 3px;
}

header.lisanium-header .lisanium-head-main .sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list .sub-child-menu ul li {
    margin: 0;
    padding: 0;
}

header.lisanium-header .lisanium-head-main .sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list .sub-child-menu ul li a {
    color: #0000004d !important;
    font-weight: 400;
}

.sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-head-menu-list ul li a i {
    margin: 0 0 2px;
    font-size: 12px;
}

.sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-menu-media {
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr 1fr;
    padding: 25px;
}

.sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-menu-media .media-item {
    height: auto !important;
}

.sub-head-menu .sub-head-menu-wrapper .sub-head-menu-group .sub-menu-media .media-item img {
    border-radius: 10px;
    width: 100%;
    height: auto;
}

/** END HEAD SUB MENU  **/

.lisanium-input-group {
    margin: 0 0 20px;
}

.lisanium-input-group label {
    font-size: 14px;
    color: var(--color-text-secondary);
    font-weight: 300;
    margin: 0 0 5px;
}

.lisanium-input-group input,
.lisanium-input-group select,
.lisanium-input-group textarea,
.lisanium-input-group .ss-main {
    width: 100%;
    border: unset;
    height: 50px;
    font-size: 14px;
    border-radius: 50px;
    padding: 0 20px;
    border: 1px solid var(--color-border);
}

.lisanium-input-group input::placeholder,
.lisanium-input-group select::placeholder,
.lisanium-input-group textarea::placeholder {
    color: #C9CACC;
}

.lisanium-input-group input {}

.lisanium-input-group select {
    height: 45px;
    padding: 0 15px;
    color: var(--color-text-muted);
}

.lisanium-input-group textarea {
    height: 120px;
    padding: 20px;
}

.lisanium-input-group .ss-main::after {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(27,78,115,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 16px;
    height: 16px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    right: 20px;
}

.lisanium-input-group .ss-main .ss-values {}

.lisanium-input-group .ss-main .ss-values .ss-single {
    color: var(--color-text-muted);
}

.lisanium-input-group .ss-main .ss-deselect {}

.lisanium-input-group .ss-main .ss-deselect svg {}

.lisanium-input-group .ss-main svg.ss-arrow {
    display: none;
}

.form-action-buttons {
    display: flex;
    justify-content: center;
}

.form-action-buttons button {
    width: fit-content;
    border: unset;
    background-color: #F9F9F9;
    height: 40px;
    font-size: 13px;
    color: #000;
    border-radius: 8px;
    padding: 0 40px;
}

.form-action-buttons button i {}

.overlay {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    background-color: #f3f8fc00;
    z-index: 99;
    backdrop-filter: blur(6px);
    transition: all .4s ease;
    opacity: 0;
    visibility: hidden;
}

.overlay.active {
    transition: all .4s ease;
    opacity: 1;
    visibility: visible;
}

/* START SEARCH */

.search-card {
    position: relative;
    background-color: #F4F4F4;
    min-width: 300px;
    width: 100%;
    border-radius: 10px;
    height: 45px;
    padding: 0 20px;
}

.search-card input {
    border: unset;
    background-color: unset;
    display: block;
    width: 100%;
    height: 100%;
    font-size: 12px;
    font-weight: 400;
}

.search-card input::placeholder {
    color: #BDBDBD;
}

.search-card .icon {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translate(0, -50%);
}

.search-card .icon svg {
    width: 20px;
    height: 20px;
    display: block;
}

.search-card .icon svg path {}

/* END SEARCH */


/* START COUNTER */

.lisanium-counter {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 20px 0 0;
}

.lisanium-counter .lisanium-counter-label {
    font-size: 14px;
    color: var(--color-secondary);
    line-height: 1;
}

.lisanium-counter .lisanium-counter-label span {
    display: block;
    margin: 0 0 5px;
}

.lisanium-counter .lisanium-counter-label strong {}

.lisanium-counter .lisanium-counter-wrap {}

.lisanium-counter .lisanium-counter-wrap .lisanium-counter-box {
    display: flex;
    gap: 10px;
    align-items: center;
}

.lisanium-counter .lisanium-counter-wrap .lisanium-counter-box .counter-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 12px;
    font-weight: 400;
    color: var(--color-text-muted);
}

.lisanium-counter .lisanium-counter-wrap .lisanium-counter-box .counter-item:nth-child(even) {}

.lisanium-counter .lisanium-counter-wrap .lisanium-counter-box .counter-item:nth-child(even) span {
    background-color: var(--color-secondary);
}

.lisanium-counter .lisanium-counter-wrap .lisanium-counter-box .counter-item span {
    width: 50px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    background-color: var(--color-primary);
    color: var(--color-bg-surface);
    font-size: 16px;
    font-weight: 600;
}

/* END COUNTER */


/* START SWIPER PAGINATION */

body .swiper-pagination {
    display: flex;
    gap: 10px;
    justify-content: center;
    align-items: center;
    width: fit-content !important;
    position: absolute;
    left: 50% !important;
    transform: translate(-50%, 0);
    bottom: 30px !important;
}

body .swiper-pagination * {
    transition: all .4s ease !important;
}

body .swiper-pagination .swiper-pagination-bullet {
    opacity: 1 !important;
    width: 14px;
    height: 14px;
    margin: 0 !important;
    border: 1px solid var(--color-border);
    background-color: transparent;
}

body .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--color-primary) !important;
    width: 17px;
    height: 17px;
}

/* END SWIPER PAGINATION */

.lisanium-background {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: auto;
    transform: translate(0, -50%);
}

.lisanium-background img {}


/* START SLIMSELECT */

body .ss-content.ss-open {
    background-color: var(--color-bg-surface);
    border: unset;
    border-radius: 15px;
    box-shadow: 0 0 15px 0px rgb(0 0 0 / 5%);
    -webkit-box-shadow: 0 0 15px 0px rgb(0 0 0 / 5%);
    -moz-box-shadow: 0 0 15px 0px rgb(0 0 0 / 5%);
}

body .ss-content.ss-open .ss-search {
    border-color: #E7E7E7;
    font-size: 12px;
    padding: 12px;
}

body .ss-content.ss-open .ss-search input {
    font-size: 12px;
    border: unset;
    height: auto;
    line-height: 1;
    padding: 0;
}

body .ss-content.ss-open .ss-list {}

body .ss-content.ss-open .ss-list .ss-option {
    font-size: 12px;
    font-weight: 400;
    padding: 10px 20px;
}

body .ss-content.ss-open .ss-list .ss-option:hover,
body .ss-content.ss-open .ss-list .ss-option.ss-selected {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

/* END SLIMSELECT */

/* START COMMON INNER PAGE HEAD */
.sanli-inner-page {
    background-color: var(--color-bg-body) !important;
}

.sanli-inner-page .sanli-header {
    position: absolute;
    top: 0;
    left: 0;
}

.sanli-page-head {
    position: relative;
    min-height: 466px;
    overflow: hidden;
    color: var(--color-text-inverse);
    background-image:
        linear-gradient(90deg, rgba(7, 10, 13, .84) 0%, rgba(7, 10, 13, .74) 55%, rgba(7, 10, 13, .55) 100%),
        url("assets/images/about-walkway.webp");
    background-position: center 36%;
    background-size: cover;
}

.sanli-page-head::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(4, 7, 10, .05) 0%, rgba(4, 7, 10, .27) 100%);
    pointer-events: none;
}

.sanli-page-head__container {
    position: relative;
    z-index: 1;
    padding-top: 242px;
    padding-bottom: 65px;
}

.sanli-page-head__breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    color: color-mix(in srgb, var(--color-text-inverse), transparent 43%);
    font-size: 13px;
}

.sanli-page-head__breadcrumb a:hover,
.sanli-page-head__breadcrumb span {
    color: var(--color-text-inverse);
}

.sanli-page-head__breadcrumb i {
    color: color-mix(in srgb, var(--color-text-inverse), transparent 68%);
    font-size: 14px;
}

.sanli-page-head h1 {
    margin: 0 0 19px;
    color: var(--color-text-inverse);
    font-size: 52px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -2px;
}

.sanli-page-head p {
    color: color-mix(in srgb, var(--color-text-inverse), transparent 37%);
    font-size: 17px;
    line-height: 1.5;
}

@media (max-width: 767px) {
    .sanli-page-head {
        min-height: 420px;
    }

    .sanli-page-head__container {
        padding-top: 225px;
    }

    .sanli-page-head h1 {
        font-size: 42px;
    }

    .sanli-page-head p {
        font-size: 15px;
    }
}

/* END COMMON INNER PAGE HEAD */

/* START ABOUT DETAILS */
.sanli-about-details {
    padding: 35px 0 81px;
    background-color: var(--color-bg-section);
}

.sanli-about-details__principles {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px;
}

.sanli-about-details__principle {
    min-height: 250px;
    padding: 42px 43px;
    border: 1px solid var(--color-border);
    border-radius: 14px;
    background-color: var(--color-bg-surface);
}

.sanli-about-details__principle h2 {
    margin: 0 0 19px;
    color: var(--color-text-primary);
    font-size: 21px;
    font-weight: var(--font-weight-bold);
    line-height: 1.2;
}

.sanli-about-details__principle p {
    max-width: 545px;
    color: var(--color-text-secondary);
    font-size: 16px;
    line-height: 1.75;
}

.sanli-about-details__head {
    margin: 97px 0 66px;
}

.sanli-about-details__head>span {
    display: block;
    margin-bottom: 23px;
    color: var(--color-danger);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
}

.sanli-about-details__head h2 {
    margin: 0;
    color: var(--color-text-primary);
    font-size: clamp(44px, 3vw, 55px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -2.2px;
}

.sanli-about-details__reasons {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 25px 28px;
}

.sanli-about-details__reasons article {
    min-height: 167px;
    padding: 39px 34px;
    border: 1px solid var(--color-border);
    border-radius: 13px;
    background-color: var(--color-bg-surface);
}

.sanli-about-details__reasons h3 {
    margin: 0 0 16px;
    color: var(--color-text-primary);
    font-size: 17px;
    font-weight: var(--font-weight-semibold);
    line-height: 1.2;
}

.sanli-about-details__reasons p {
    color: var(--color-text-secondary);
    font-size: 14px;
    line-height: 1.65;
}

@media (max-width: 991px) {
    .sanli-about-details__principle {
        padding: 34px;
    }

    .sanli-about-details__head {
        margin: 75px 0 50px;
    }
}

@media (max-width: 767px) {
    .sanli-about-details {
        padding: 28px 0 65px;
    }

    .sanli-about-details__principles,
    .sanli-about-details__reasons {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .sanli-about-details__principle {
        min-height: auto;
        padding: 28px 24px;
    }

    .sanli-about-details__principle p {
        font-size: 15px;
    }

    .sanli-about-details__head {
        margin: 60px 0 38px;
    }

    .sanli-about-details__head>span {
        margin-bottom: 17px;
    }

    .sanli-about-details__head h2 {
        font-size: 36px;
        letter-spacing: -1.5px;
    }

    .sanli-about-details__reasons article {
        min-height: auto;
        padding: 28px 24px;
    }
}

/* END ABOUT DETAILS */

/* START SERVICE DETAIL */
.sanli-service-detail {
    padding: 70px 0 105px;
    background-color: var(--color-bg-surface);
}

.sanli-service-detail__container {
    display: grid;
    grid-template-columns: minmax(0, 906px) 372px;
    align-items: start;
    gap: 46px;
}

.sanli-service-detail__media {
    height: 500px;
    margin: 0 0 35px;
    overflow: hidden;
    border-radius: 14px;
    background-color: var(--color-bg-muted);
}

.sanli-service-detail__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.sanli-service-detail__intro h2 {
    margin: 0 0 5px;
    color: var(--color-text-primary);
    font-size: 28px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -.7px;
}

.sanli-service-detail__intro strong {
    display: block;
    margin-bottom: 22px;
    color: var(--color-text-primary);
    font-size: 14px;
    font-weight: var(--font-weight-medium);
    line-height: 1.55;
}

.sanli-service-detail__intro p,
.sanli-service-detail__process p {
    color: var(--color-text-secondary);
    font-size: 14px;
    line-height: 1.7;
}

.sanli-service-detail__block {
    margin-top: 37px;
}

.sanli-service-detail__block h3 {
    margin: 0 0 20px;
    color: var(--color-text-primary);
    font-size: 18px;
    font-weight: var(--font-weight-bold);
    line-height: 1.25;
}

.sanli-service-detail__features {
    display: grid;
    gap: 15px;
    margin: 0;
}

.sanli-service-detail__features li {
    display: flex;
    align-items: center;
    gap: 11px;
    color: var(--color-text-muted);
    font-size: 14px;
    line-height: 1.35;
}

.sanli-service-detail__features i {
    flex: 0 0 auto;
    color: var(--color-text-primary);
    font-size: 17px;
}

.sanli-service-detail__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
}

.sanli-service-detail__tags li {
    padding: 9px 17px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    color: var(--color-text-muted);
    background-color: var(--color-bg-surface);
    font-size: 12px;
    line-height: 1;
}

.sanli-service-detail__process {
    margin-top: 40px;
}

.sanli-service-detail__process h3 {
    margin-bottom: 14px;
}

.sanli-service-detail__aside {
    display: grid;
    gap: 21px;
}

.sanli-service-detail__nav {
    padding: 29px 27px 24px;
    border-radius: 10px;
    background-color: var(--color-bg-section);
}

.sanli-service-detail__nav h2 {
    margin: 0 0 16px;
    color: var(--color-text-primary);
    font-size: 15px;
    font-weight: var(--font-weight-bold);
}

.sanli-service-detail__nav a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 50px;
    border-bottom: 1px solid var(--color-border);
    color: var(--color-text-muted);
    font-size: 13px;
    line-height: 1.3;
}

.sanli-service-detail__nav a:last-child {
    border-bottom: 0;
}

.sanli-service-detail__nav a:hover,
.sanli-service-detail__nav a.active {
    color: var(--color-danger);
}

.sanli-service-detail__nav a.active {
    font-weight: var(--font-weight-semibold);
}

.sanli-service-detail__nav a i {
    font-size: 18px;
}

.sanli-service-detail__offer {
    padding: 29px 28px 25px;
    border-radius: 10px;
    color: var(--color-text-inverse);
    background-color: var(--color-bg-dark);
}

.sanli-service-detail__offer h2 {
    margin: 0 0 16px;
    color: var(--color-text-inverse);
    font-size: 16px;
    font-weight: var(--font-weight-bold);
}

.sanli-service-detail__offer p {
    margin-bottom: 24px;
    color: color-mix(in srgb, var(--color-text-inverse), transparent 35%);
    font-size: 13px;
    line-height: 1.55;
}

.sanli-service-detail__offer-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 54px;
    border-radius: 6px;
    color: var(--color-text-inverse);
    background-color: var(--color-danger);
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
}

.sanli-service-detail__offer-button:hover {
    color: var(--color-text-inverse);
    background-color: color-mix(in srgb, var(--color-danger), black 12%);
}

.sanli-service-detail__phone {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 17px;
    color: var(--color-text-inverse);
    font-size: 12px;
    font-weight: var(--font-weight-semibold);
}

@media (max-width: 991px) {
    .sanli-service-detail__container {
        grid-template-columns: minmax(0, 1fr) 290px;
        gap: 30px;
    }

    .sanli-service-detail__media {
        height: 410px;
    }
}

@media (max-width: 767px) {
    .sanli-service-detail {
        padding: 45px 0 70px;
    }

    .sanli-service-detail__container {
        grid-template-columns: 1fr;
    }

    .sanli-service-detail__media {
        height: 310px;
        margin-bottom: 28px;
    }

    .sanli-service-detail__intro h2 {
        font-size: 25px;
    }

    .sanli-service-detail__aside {
        grid-row: 2;
    }

    .sanli-service-detail__nav,
    .sanli-service-detail__offer {
        padding: 25px 22px;
    }
}

@media (max-width: 480px) {
    .sanli-service-detail__media {
        height: 235px;
    }

    .sanli-service-detail__tags {
        gap: 8px;
    }

    .sanli-service-detail__tags li {
        padding: 8px 12px;
    }
}

/* END SERVICE DETAIL */

/* START BLOG LIST */
.sanli-blog-list {
    padding: 72px 0 96px;
    background-color: var(--color-bg-section);
}

.sanli-blog-list__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

.sanli-blog-list-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: 11px;
    background-color: var(--color-bg-surface);
    transition: border-color var(--transition-normal), transform var(--transition-normal), box-shadow var(--transition-normal);
}

.sanli-blog-list-card:hover {
    border-color: color-mix(in srgb, var(--color-danger), transparent 65%);
    box-shadow: 0 16px 35px color-mix(in srgb, var(--color-text-primary), transparent 94%);
    transform: translateY(-3px);
}

.sanli-blog-list-card__image {
    display: block;
    height: 322px;
    overflow: hidden;
    background-color: var(--color-bg-muted);
}

.sanli-blog-list-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-normal);
}

.sanli-blog-list-card:first-child .sanli-blog-list-card__image img {
    object-position: center 17%;
}

.sanli-blog-list-card:hover .sanli-blog-list-card__image img {
    transform: scale(1.035);
}

.sanli-blog-list-card__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    padding: 30px 29px 31px;
}

.sanli-blog-list-card__category {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    margin-bottom: 19px;
    padding: 5px 13px;
    border-radius: var(--radius-full);
    color: var(--color-danger);
    background-color: color-mix(in srgb, var(--color-danger), transparent 90%);
    font-size: 11px;
    font-weight: var(--font-weight-semibold);
    line-height: 1;
}

.sanli-blog-list-card h2 {
    margin: 0 0 17px;
}

.sanli-blog-list-card h2 a {
    display: block;
    color: var(--color-text-primary);
    font-size: 20px;
    font-weight: var(--font-weight-bold);
    line-height: 1.35;
    letter-spacing: -.4px;
}

.sanli-blog-list-card h2 a:hover {
    color: var(--color-danger);
}

.sanli-blog-list-card p {
    margin-bottom: 25px;
    color: var(--color-text-secondary);
    font-size: 14px;
    line-height: 1.65;
}

.sanli-blog-list-card__more {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    color: var(--color-text-primary);
    font-size: 13px;
    font-weight: var(--font-weight-semibold);
}

.sanli-blog-list-card__more i {
    font-size: 16px;
    transition: transform var(--transition-normal);
}

.sanli-blog-list-card__more:hover {
    color: var(--color-danger);
}

.sanli-blog-list-card__more:hover i {
    transform: translateX(4px);
}

@media (max-width: 991px) {
    .sanli-blog-list {
        padding: 65px 0 82px;
    }

    .sanli-blog-list__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sanli-blog-list-card__image {
        height: 285px;
    }
}

@media (max-width: 767px) {
    .sanli-blog-list {
        padding: 48px 0 68px;
    }

    .sanli-blog-list__grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .sanli-blog-list-card__image {
        height: 280px;
    }

    .sanli-blog-list-card__content {
        padding: 25px 23px 27px;
    }
}

@media (max-width: 480px) {
    .sanli-blog-list-card__image {
        height: 225px;
    }

    .sanli-blog-list-card h2 a {
        font-size: 18px;
    }
}

/* END BLOG LIST */

/* START CONTACT */
.sanli-contact {
    padding: 76px 0 103px;
    background-color: var(--color-bg-surface);
}

.sanli-contact__container {
    display: grid;
    grid-template-columns: minmax(0, 650px) minmax(0, 650px);
    align-items: start;
    gap: 64px;
}

.sanli-contact__head>span {
    display: block;
    margin-bottom: 23px;
    color: var(--color-danger);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
}

.sanli-contact__head h2 {
    margin: 0 0 23px;
    color: var(--color-text-primary);
    font-size: 48px;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -1.8px;
}

.sanli-contact__head p {
    max-width: 620px;
    color: var(--color-text-secondary);
    font-size: 16px;
    line-height: 1.65;
}

.sanli-contact__head p a {
    color: var(--color-danger);
    font-weight: var(--font-weight-semibold);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.sanli-contact__form {
    display: grid;
    gap: 19px;
    margin-top: 37px;
}

.sanli-contact__form-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.sanli-contact__field {
    display: grid;
    gap: 10px;
}

.sanli-contact__field>span {
    color: var(--color-text-primary);
    font-size: 12px;
    font-weight: var(--font-weight-semibold);
    line-height: 1;
}

.sanli-contact__field input,
.sanli-contact__field textarea {
    width: 100%;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    color: var(--color-text-primary);
    background-color: var(--color-bg-surface);
    font-size: 14px;
    transition: border-color var(--transition-normal), box-shadow var(--transition-normal);
}

.sanli-contact__field input {
    height: 53px;
    padding: 0 17px;
}

.sanli-contact__field textarea {
    min-height: 168px;
    padding: 16px 17px;
    resize: vertical;
}

.sanli-contact__field input::placeholder,
.sanli-contact__field textarea::placeholder {
    color: color-mix(in srgb, var(--color-text-secondary), transparent 35%);
}

.sanli-contact__field input:focus,
.sanli-contact__field textarea:focus {
    border-color: var(--color-danger);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-danger), transparent 90%);
}

.sanli-contact__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    width: 218px;
    min-height: 58px;
    margin-top: 5px;
    border-radius: 7px;
    color: var(--color-text-inverse);
    background-color: var(--color-danger);
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
}

.sanli-contact__submit:hover {
    background-color: color-mix(in srgb, var(--color-danger), black 12%);
}

.sanli-contact__form>small {
    margin-top: -3px;
    color: var(--color-text-secondary);
    font-size: 11px;
    line-height: 1.4;
}

.sanli-contact__info {
    display: grid;
    margin: 0;
    border-top: 1px solid var(--color-border);
    font-style: normal;
}

.sanli-contact__info-item {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 15px;
    min-height: 102px;
    padding: 23px 0;
    border-bottom: 1px solid var(--color-border);
    color: var(--color-text-primary);
}

.sanli-contact__info-item>i {
    margin-top: 3px;
    color: var(--color-danger);
    font-size: 20px;
}

.sanli-contact__info-item>span {
    display: grid;
    gap: 7px;
}

.sanli-contact__info-item small {
    color: var(--color-text-secondary);
    font-size: 12px;
    line-height: 1;
}

.sanli-contact__info-item strong {
    color: var(--color-text-primary);
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
    line-height: 1.55;
}

.sanli-contact__info a:hover strong {
    color: var(--color-danger);
}

.sanli-contact__map {
    height: 462px;
    margin-top: 35px;
    overflow: hidden;
    border-radius: 15px;
    background-color: var(--color-bg-muted);
}

.sanli-contact__map iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

@media (max-width: 991px) {
    .sanli-contact__container {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 42px;
    }

    .sanli-contact__head h2 {
        font-size: 41px;
    }
}

@media (max-width: 767px) {
    .sanli-contact {
        padding: 52px 0 72px;
    }

    .sanli-contact__container {
        grid-template-columns: 1fr;
        gap: 55px;
    }

    .sanli-contact__head>span {
        margin-bottom: 17px;
    }

    .sanli-contact__head h2 {
        font-size: 36px;
        letter-spacing: -1.4px;
    }

    .sanli-contact__head h2 br {
        display: none;
    }

    .sanli-contact__form-row {
        grid-template-columns: 1fr;
    }

    .sanli-contact__map {
        height: 380px;
    }
}

@media (max-width: 480px) {
    .sanli-contact__submit {
        width: 100%;
    }

    .sanli-contact__info-item {
        min-height: 94px;
    }

    .sanli-contact__map {
        height: 310px;
    }
}

/* END CONTACT */

/* Contact form feedback */
.sanli-contact__alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 28px;
    padding: 14px 16px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.5;
}

.sanli-contact__alert i {
    font-size: 20px;
    line-height: 1;
}

.sanli-contact__alert.is-success {
    color: #166534;
    background-color: var(--color-success-light);
    border: 1px solid color-mix(in srgb, var(--color-success), transparent 70%);
}

.sanli-contact__alert.is-error {
    color: #991b1b;
    background-color: var(--color-danger-light);
    border: 1px solid color-mix(in srgb, var(--color-danger), transparent 70%);
}

.sanli-contact__alert + .sanli-contact__form {
    margin-top: 22px;
}

.sanli-contact__field.has-error input,
.sanli-contact__field.has-error textarea {
    border-color: var(--color-danger);
}

.sanli-contact__error {
    margin-top: -4px;
    color: var(--color-danger);
    font-size: 12px;
    font-style: normal;
    line-height: 1.3;
}

.sanli-contact__hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* START DYNAMIC PAGES */

/* Header dropdown */
.sanli-header__nav li.has-sub {
    position: relative;
}

.sanli-header__sub {
    position: absolute;
    top: calc(100% - 14px);
    left: -18px;
    z-index: 30;
    min-width: 250px;
    display: block !important;
    height: auto !important;
    padding: 10px;
    border: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 90%);
    border-radius: 12px;
    background-color: var(--sanli-header-bg);
    box-shadow: 0 22px 45px rgba(0, 0, 0, .28);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity var(--transition-normal), transform var(--transition-normal), visibility var(--transition-normal);
}

.sanli-header__nav li.has-sub:hover > .sanli-header__sub,
.sanli-header__nav li.has-sub:focus-within > .sanli-header__sub {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.sanli-header__nav .sanli-header__sub li,
.sanli-header__nav .sanli-header__sub a {
    height: auto;
}

.sanli-header__nav .sanli-header__sub a {
    padding: 11px 14px;
    border-radius: 8px;
    font-size: 14px;
    white-space: normal;
}

.sanli-header__nav .sanli-header__sub a::after {
    display: none;
}

.sanli-header__nav .sanli-header__sub a:hover {
    color: var(--color-text-inverse);
    background-color: color-mix(in srgb, var(--color-text-inverse), transparent 92%);
}

.sanli-header__nav li.has-sub > a i {
    transition: transform var(--transition-normal);
}

.sanli-header__nav li.has-sub:hover > a i {
    transform: rotate(180deg);
}

@media (max-width: 991px) {
    .sanli-header__nav {
        max-height: calc(100vh - 140px);
        overflow-y: auto;
    }

    .sanli-header__sub {
        position: static;
        display: none !important;
        min-width: 0;
        margin: 0 0 8px;
        padding: 4px 0 4px 14px;
        border: 0;
        border-left: 2px solid var(--sanli-header-accent);
        border-radius: 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
    }

    .sanli-header__nav li.has-sub.is-open > .sanli-header__sub {
        display: block !important;
    }

    .sanli-header__nav li.has-sub > a i {
        width: 36px;
        height: 30px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 6px;
        background-color: color-mix(in srgb, var(--color-text-inverse), transparent 92%);
        font-size: 16px;
    }

    .sanli-header__nav li.has-sub:hover > a i {
        transform: none;
    }

    .sanli-header__nav li.has-sub.is-open > a i {
        transform: rotate(180deg);
    }

    .sanli-header__nav .sanli-header__sub a {
        padding: 9px 0;
        font-size: 14px;
    }
}

/* Generic */
.sanli-empty {
    padding: 60px 20px;
    border: 1px dashed var(--color-border-strong);
    border-radius: 12px;
    color: var(--color-text-secondary);
    text-align: center;
    font-size: 15px;
}

.sanli-detail-eyebrow {
    display: inline-block;
    margin-bottom: 14px;
    color: var(--color-danger);
    font-size: 13px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
}

.sanli-related__title {
    font-size: clamp(30px, 2.4vw, 40px) !important;
    letter-spacing: -1.2px !important;
    margin-bottom: 0 !important;
}

.sanli-related .sanli-completed__head {
    align-items: center;
    margin-bottom: 30px;
}

.sanli-completed__head--page {
    padding-top: 70px;
}

/* Rich text (admin editor content) */
.sanli-rich-text {
    color: var(--color-text-secondary);
    font-size: 15px;
    line-height: 1.8;
}

.sanli-rich-text > *:first-child {
    margin-top: 0;
}

.sanli-rich-text p,
.sanli-rich-text ul,
.sanli-rich-text ol {
    margin: 0 0 18px;
}

.sanli-rich-text h2,
.sanli-rich-text h3,
.sanli-rich-text h4 {
    margin: 32px 0 14px;
    color: var(--color-text-primary);
    font-weight: var(--font-weight-bold);
    line-height: 1.3;
    letter-spacing: -.3px;
}

.sanli-rich-text h2 { font-size: 24px; }
.sanli-rich-text h3 { font-size: 20px; }
.sanli-rich-text h4 { font-size: 17px; }

.sanli-rich-text ul,
.sanli-rich-text ol {
    padding-left: 20px;
}

.sanli-rich-text ul { list-style: disc; }
.sanli-rich-text ol { list-style: decimal; }

.sanli-rich-text li {
    margin-bottom: 8px;
}

.sanli-rich-text li::marker {
    color: var(--color-danger);
}

.sanli-rich-text a {
    color: var(--color-danger);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.sanli-rich-text strong,
.sanli-rich-text b {
    color: var(--color-text-primary);
}

.sanli-rich-text img {
    max-width: 100%;
    height: auto;
    margin: 10px 0;
    border-radius: 12px;
}

.sanli-rich-text blockquote {
    margin: 26px 0;
    padding: 20px 24px;
    border-left: 3px solid var(--color-danger);
    border-radius: 0 10px 10px 0;
    color: var(--color-text-primary);
    background-color: var(--color-bg-section);
    font-size: 16px;
    font-style: italic;
}

.sanli-rich-text table {
    width: 100%;
    margin: 20px 0;
    border-collapse: collapse;
    font-size: 14px;
}

.sanli-rich-text th,
.sanli-rich-text td {
    padding: 10px 12px;
    border: 1px solid var(--color-border);
    text-align: left;
}

/* Services list page */
.sanli-services-page {
    padding-top: 80px;
}

.sanli-services-page__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.sanli-services-page__card h3 a {
    color: inherit;
}

.sanli-services-page__card h3 a::before {
    content: "";
    position: absolute;
    inset: -400px;
}

.sanli-services-page__summary {
    position: absolute;
    right: 30px;
    bottom: 32px;
    left: 100px;
    z-index: 1;
    margin: 0;
    color: color-mix(in srgb, var(--color-text-inverse), transparent 18%);
    font-size: 13px;
    line-height: 1.5;
    pointer-events: none;
}

.sanli-services-page__card .sanli-service-card__shade {
    background: linear-gradient(180deg, rgba(4, 7, 10, .68) 0%, rgba(4, 7, 10, .12) 45%, rgba(4, 7, 10, .72) 100%);
}

.sanli-services-page__card > a {
    z-index: 2;
}

@media (max-width: 991px) {
    .sanli-services-page__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575px) {
    .sanli-services-page {
        padding-top: 50px;
    }

    .sanli-services-page__grid {
        grid-template-columns: 1fr;
    }
}

/* Project card full link */
.sanli-completed-card > a.sanli-completed-card__link {
    inset: 0;
    z-index: 1;
    width: auto;
    height: auto;
    border-radius: 0;
    background: none;
    opacity: 0 !important;
    transform: none !important;
}

/* Project detail info */
.sanli-project-info dl {
    margin: 0;
}

.sanli-project-info dl > div {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid var(--color-border);
}

.sanli-project-info dl > div:last-child {
    border-bottom: 0;
}

.sanli-project-info dt {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    color: var(--color-text-secondary);
    font-size: 13px;
    font-weight: var(--font-weight-medium);
}

.sanli-project-info dt i {
    color: var(--color-danger);
    font-size: 16px;
}

.sanli-project-info dd {
    margin: 0;
    color: var(--color-text-primary);
    font-size: 13px;
    font-weight: var(--font-weight-semibold);
    text-align: right;
}

.sanli-project-info dd a {
    color: var(--color-text-primary);
    min-height: 0;
    display: inline;
    border: 0;
}

.sanli-project-info dd a:hover {
    color: var(--color-danger);
}

/* Gallery + lightbox */
.sanli-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.sanli-gallery__item {
    position: relative;
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 10px;
    background-color: var(--color-bg-muted);
}

.sanli-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-slow);
}

.sanli-gallery__item span {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-inverse);
    background-color: rgba(7, 10, 13, .45);
    font-size: 26px;
    opacity: 0;
    transition: opacity var(--transition-normal);
}

.sanli-gallery__item:hover img {
    transform: scale(1.06);
}

.sanli-gallery__item:hover span {
    opacity: 1;
}

.sanli-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 80px;
    background-color: rgba(7, 10, 13, .92);
}

.sanli-lightbox[hidden] {
    display: none;
}

.sanli-lightbox figure {
    margin: 0;
    max-width: 100%;
    text-align: center;
}

.sanli-lightbox img {
    max-width: 100%;
    max-height: calc(100vh - 140px);
    border-radius: 10px;
    object-fit: contain;
}

.sanli-lightbox figcaption {
    margin-top: 14px;
    color: color-mix(in srgb, var(--color-text-inverse), transparent 25%);
    font-size: 14px;
}

.sanli-lightbox button {
    position: absolute;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    color: var(--color-text-inverse);
    background-color: color-mix(in srgb, var(--color-text-inverse), transparent 88%);
    font-size: 22px;
}

.sanli-lightbox button:hover {
    background-color: var(--color-danger);
}

.sanli-lightbox__close { top: 20px; right: 20px; }
.sanli-lightbox__nav.is-prev { left: 20px; }
.sanli-lightbox__nav.is-next { right: 20px; }

@media (max-width: 767px) {
    .sanli-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .sanli-lightbox {
        padding: 70px 12px;
    }

    .sanli-lightbox__nav {
        top: auto;
        bottom: 16px;
    }

    .sanli-lightbox__nav.is-prev { left: calc(50% - 58px); }
    .sanli-lightbox__nav.is-next { right: calc(50% - 58px); }
}

/* Blog list extras */
.sanli-blog-list__head {
    margin-bottom: 36px;
}

.sanli-blog-list__head h2 {
    margin: 0 0 14px;
    color: var(--color-text-primary);
    font-size: clamp(34px, 2.8vw, 48px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -1.6px;
}

.sanli-blog-list__head p {
    color: var(--color-text-secondary);
    font-size: 16px;
    line-height: 1.6;
}

.sanli-blog-filters {
    flex-wrap: wrap;
    margin: 0 0 30px;
}

.sanli-blog-filters a {
    height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 15px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    color: var(--color-text-secondary);
    background-color: var(--color-bg-surface);
    font-size: 12px;
    font-weight: var(--font-weight-medium);
}

.sanli-blog-filters a small {
    opacity: .6;
}

.sanli-blog-filters a:hover,
.sanli-blog-filters a.active {
    border-color: var(--color-text-primary);
    color: var(--color-text-inverse);
    background-color: var(--color-text-primary);
}

.sanli-blog-list-card__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 19px;
}

.sanli-blog-list-card__meta .sanli-blog-list-card__category {
    margin-bottom: 0;
}

.sanli-blog-list-card__meta time {
    color: var(--color-text-secondary);
    font-size: 12px;
}

a.sanli-blog-list-card__category:hover {
    color: var(--color-text-inverse);
    background-color: var(--color-danger);
}

/* Pagination */
.sanli-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 48px;
}

.sanli-pagination a,
.sanli-pagination span {
    min-width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    color: var(--color-text-primary);
    background-color: var(--color-bg-surface);
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
}

.sanli-pagination a:hover {
    border-color: var(--color-danger);
    color: var(--color-danger);
}

.sanli-pagination span.active {
    border-color: var(--color-danger);
    color: var(--color-text-inverse);
    background-color: var(--color-danger);
}

.sanli-pagination span.dots {
    border: 0;
    background: none;
}

/* Blog detail */
.sanli-article__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 22px;
    margin-bottom: 22px;
    color: var(--color-text-secondary);
    font-size: 13px;
}

.sanli-article__meta .sanli-blog-list-card__category {
    margin-bottom: 0;
}

.sanli-article__meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.sanli-article__meta i {
    color: var(--color-danger);
    font-size: 15px;
}

.sanli-article__lead {
    margin: 0 0 26px;
    padding-bottom: 26px;
    border-bottom: 1px solid var(--color-border);
    color: var(--color-text-primary);
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1.6;
}

.sanli-article__share {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 40px;
    padding-top: 26px;
    border-top: 1px solid var(--color-border);
}

.sanli-article__share strong {
    margin-right: 6px;
    color: var(--color-text-primary);
    font-size: 14px;
}

.sanli-article__share a {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    color: var(--color-text-primary);
    font-size: 17px;
}

.sanli-article__share a:hover {
    border-color: var(--color-danger);
    color: var(--color-text-inverse);
    background-color: var(--color-danger);
}

.sanli-article__pager {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 30px;
}

.sanli-article__pager a {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 20px 22px;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    color: var(--color-text-primary);
    background-color: var(--color-bg-section);
    transition: border-color var(--transition-normal);
}

.sanli-article__pager a:hover {
    border-color: var(--color-danger);
}

.sanli-article__pager a.is-next {
    grid-column: 2;
    text-align: right;
}

.sanli-article__pager small {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--color-danger);
    font-size: 12px;
    font-weight: var(--font-weight-semibold);
}

.sanli-article__pager a.is-next small {
    justify-content: flex-end;
}

.sanli-article__pager span {
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
    line-height: 1.4;
}

.sanli-recent-posts a {
    justify-content: flex-start;
    gap: 12px;
    min-height: 0;
    padding: 12px 0;
}

.sanli-recent-posts img {
    width: 64px;
    height: 52px;
    flex-shrink: 0;
    border-radius: 8px;
    object-fit: cover;
}

.sanli-recent-posts strong {
    display: block;
    margin-bottom: 4px;
    color: var(--color-text-primary);
    font-size: 13px;
    font-weight: var(--font-weight-semibold);
    line-height: 1.35;
}

.sanli-recent-posts a:hover strong {
    color: var(--color-danger);
}

.sanli-recent-posts small {
    color: var(--color-text-secondary);
    font-size: 11px;
}

.sanli-service-detail__nav a small {
    min-width: 26px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    background-color: var(--color-bg-surface);
    font-size: 11px;
}

@media (max-width: 575px) {
    .sanli-article__pager {
        grid-template-columns: 1fr;
    }

    .sanli-article__pager a.is-next {
        grid-column: auto;
    }

    .sanli-article__lead {
        font-size: 16px;
    }
}

/* 404 */
.sanli-not-found {
    padding: 90px 0 110px;
    text-align: center;
    background-color: var(--color-bg-surface);
}

.sanli-not-found strong {
    display: block;
    color: var(--color-danger);
    font-size: clamp(80px, 12vw, 150px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -6px;
}

.sanli-not-found h2 {
    margin: 10px 0 12px;
    color: var(--color-text-primary);
    font-size: 30px;
    font-weight: 800;
}

.sanli-not-found p {
    margin-bottom: 30px;
    color: var(--color-text-secondary);
}

.sanli-not-found__actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}

.sanli-not-found__actions .sanli-service-detail__offer-button {
    padding: 0 26px;
}

/* END DYNAMIC PAGES */

/* Uploaded logos */
.sanli-header__logo img,
.sanli-footer__logo img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 64px;
    object-fit: contain;
    object-position: left center;
}

.sanli-reference-logo.has-image img {
    display: block;
    max-width: 100%;
    max-height: 64px;
    object-fit: contain;
}

/* ---------- Language switcher ---------- */
.sanli-lang {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    z-index: calc(var(--z-sticky) + 5);
}

.sanli-header__language {
    height: 100%;
    color: var(--sanli-header-muted);
    font-size: 13px;
    font-weight: var(--font-weight-medium);
    line-height: 1;
    transition: color var(--transition-fast);
}

.sanli-header__language:hover,
.sanli-lang.is-open .sanli-header__language {
    color: var(--sanli-header-text);
}

.sanli-header__language .sanli-lang__caret {
    font-size: 14px;
    margin-left: -3px;
    transition: transform var(--transition-fast);
}

.sanli-lang.is-open .sanli-lang__caret {
    transform: rotate(180deg);
}

.sanli-lang__menu {
    position: absolute;
    top: calc(100% + 2px);
    right: -10px;
    min-width: 150px;
    padding: 6px;
    border: 1px solid color-mix(in srgb, var(--color-text-inverse), transparent 88%);
    border-radius: var(--radius-lg);
    background: #1a1d22;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .35);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity var(--transition-fast), transform var(--transition-fast), visibility var(--transition-fast);
}

.sanli-lang.is-open .sanli-lang__menu {
    opacity: 1;
    visibility: visible;
    transform: none;
}

.sanli-lang__menu button {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-radius: var(--radius-md);
    color: color-mix(in srgb, var(--color-text-inverse), transparent 25%);
    font-size: 13px;
    text-align: left;
}

.sanli-lang__menu button b {
    min-width: 28px;
    padding: 3px 0;
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--color-text-inverse), transparent 90%);
    font-size: 11px;
    text-align: center;
}

.sanli-lang__menu button:hover {
    background: color-mix(in srgb, var(--color-text-inverse), transparent 93%);
    color: var(--color-text-inverse);
}

.sanli-lang__menu button.is-active {
    color: var(--color-text-inverse);
}

.sanli-lang__menu button.is-active b {
    background: var(--color-danger);
}

/* Hide Google Translate UI */
.goog-te-banner-frame,
.skiptranslate > iframe,
iframe.skiptranslate,
#goog-gt-tt,
.goog-te-balloon-frame,
.goog-tooltip,
.VIpgJd-ZVi9od-ORHb-OEVmcd,
.VIpgJd-ZVi9od-aZ2wEe-wOHMyf,
.VIpgJd-yAWNEb-L7lbkb,
#google_translate_element {
    display: none !important;
}

body {
    top: 0 !important;
}

.goog-text-highlight,
font[style*="background-color"] {
    background: none !important;
    box-shadow: none !important;
}

/* ---------- Search modal ---------- */
.sanli-search-open,
.sanli-search-open body {
    overflow: hidden;
}

.sanli-search {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal);
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 12vh 20px 20px;
}

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

.sanli-search__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(9, 11, 14, .72);
    backdrop-filter: blur(6px);
    opacity: 0;
    transition: opacity .2s ease;
}

.sanli-search__panel {
    position: relative;
    width: min(720px, 100%);
    max-height: 76vh;
    display: flex;
    flex-direction: column;
    border-radius: var(--radius-xl);
    background: var(--color-bg-surface);
    box-shadow: 0 30px 80px rgba(0, 0, 0, .35);
    overflow: hidden;
    opacity: 0;
    transform: translateY(-14px) scale(.98);
    transition: opacity .2s ease, transform .2s ease;
}

.sanli-search.is-open .sanli-search__backdrop,
.sanli-search.is-open .sanli-search__panel {
    opacity: 1;
    transform: none;
}

.sanli-search__form {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 12px 0 22px;
    border-bottom: 1px solid var(--color-border);
}

.sanli-search__form > i {
    color: var(--color-text-secondary);
    font-size: 22px;
}

.sanli-search__form input {
    flex: 1;
    min-width: 0;
    height: 68px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--color-text-primary);
    font-size: 18px;
}

.sanli-search__form input::-webkit-search-cancel-button {
    display: none;
}

.sanli-search__form button {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    color: var(--color-text-muted);
    font-size: 22px;
}

.sanli-search__form button:hover {
    background: var(--color-bg-muted);
    color: var(--color-text-primary);
}

.sanli-search__results {
    overflow-y: auto;
    transition: opacity .15s;
}

.sanli-search__results:not(:empty) {
    padding: 8px;
}

.sanli-search__results.is-loading {
    opacity: .5;
}

.sanli-search__item {
    display: block;
    padding: 12px 14px;
    border-radius: var(--radius-lg);
    color: var(--color-text-primary);
    outline: 0;
}

.sanli-search__item:hover,
.sanli-search__item:focus {
    background: var(--color-bg-muted);
}

.sanli-search__item small,
.sanli-search-result__body small {
    display: inline-block;
    margin-bottom: 4px;
    padding: 2px 8px;
    border-radius: var(--radius-full);
    background: var(--color-danger-light);
    color: var(--color-danger);
    font-size: 11px;
    font-weight: var(--font-weight-semibold);
    letter-spacing: .02em;
}

.sanli-search__item strong {
    display: block;
    font-size: 15px;
    font-weight: var(--font-weight-semibold);
}

.sanli-search__item span {
    display: block;
    margin-top: 3px;
    color: var(--color-text-muted);
    font-size: 13px;
    line-height: 1.5;
}

.sanli-search mark,
.sanli-search-page mark {
    padding: 0 2px;
    border-radius: 3px;
    background: #fde68a;
    color: inherit;
}

.sanli-search__all {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 4px;
    padding: 12px;
    border-radius: var(--radius-lg);
    color: var(--color-danger);
    font-size: 14px;
    font-weight: var(--font-weight-semibold);
    outline: 0;
}

.sanli-search__all:hover,
.sanli-search__all:focus {
    background: var(--color-danger-light);
    color: var(--color-danger);
}

.sanli-search__empty {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 14px;
    color: var(--color-text-muted);
    font-size: 14px;
}

.sanli-search__empty i {
    font-size: 20px;
}

.sanli-search__hint {
    margin: 0;
    padding: 12px 22px;
    border-top: 1px solid var(--color-border);
    background: var(--color-bg-section);
    color: var(--color-text-secondary);
    font-size: 12px;
}

.sanli-search__hint kbd {
    padding: 2px 6px;
    border: 1px solid var(--color-border-strong);
    border-radius: 4px;
    background: #fff;
    color: var(--color-text-muted);
    font-family: inherit;
    font-size: 11px;
}

/* ---------- Search results page ---------- */
.sanli-search-page {
    padding: 70px 0 100px;
}

.sanli-search-page .container {
    max-width: 920px;
}

.sanli-search-page__form {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 6px 6px 20px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-bg-surface);
    box-shadow: var(--shadow-md);
}

.sanli-search-page__form:focus-within {
    border-color: var(--color-border-strong);
}

.sanli-search-page__form > i {
    color: var(--color-text-secondary);
    font-size: 20px;
}

.sanli-search-page__form input {
    flex: 1;
    min-width: 0;
    height: 52px;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 16px;
}

.sanli-search-page__form button {
    height: 50px;
    padding: 0 28px;
    border-radius: var(--radius-lg);
    background: var(--color-danger);
    color: #fff;
    font-weight: var(--font-weight-semibold);
}

.sanli-search-page__form button:hover {
    background: color-mix(in srgb, var(--color-danger), black 14%);
}

.sanli-search-page__info {
    margin: 26px 0 18px;
    color: var(--color-text-muted);
}

.sanli-search-page__list {
    display: grid;
    gap: 12px;
}

.sanli-search-result {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 14px 20px 14px 14px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-bg-surface);
    color: var(--color-text-primary);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}

.sanli-search-result:hover {
    border-color: var(--color-border-strong);
    box-shadow: var(--shadow-lg);
    color: var(--color-text-primary);
    transform: translateY(-1px);
}

.sanli-search-result > img,
.sanli-search-result__icon {
    flex: 0 0 96px;
    width: 96px;
    height: 72px;
    border-radius: var(--radius-md);
    object-fit: cover;
}

.sanli-search-result__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-bg-muted);
    color: var(--color-text-muted);
    font-size: 26px;
}

.sanli-search-result__body {
    flex: 1;
    min-width: 0;
}

.sanli-search-result__body strong {
    display: block;
    font-size: 17px;
    font-weight: var(--font-weight-semibold);
}

.sanli-search-result__body > span {
    display: block;
    margin-top: 4px;
    color: var(--color-text-muted);
    font-size: 14px;
    line-height: 1.55;
}

.sanli-search-result > i {
    color: var(--color-text-secondary);
    font-size: 20px;
}

.sanli-search-page__empty {
    margin-top: 40px;
    text-align: center;
}

.sanli-search-page__empty > i {
    color: var(--color-text-secondary);
    font-size: 48px;
}

.sanli-search-page__empty h2 {
    margin: 10px 0 8px;
    font-size: 22px;
}

.sanli-search-page__empty p {
    color: var(--color-text-muted);
}

.sanli-search-page__empty .sanli-not-found__actions {
    justify-content: center;
}

@media (max-width: 767px) {
    .sanli-search {
        padding: 70px 12px 12px;
    }

    .sanli-search__form input {
        height: 58px;
        font-size: 16px;
    }

    .sanli-search-page {
        padding: 40px 0 70px;
    }

    .sanli-search-page__form button {
        padding: 0 18px;
    }

    .sanli-search-result {
        gap: 12px;
        padding: 10px;
    }

    .sanli-search-result > img,
    .sanli-search-result__icon {
        flex-basis: 64px;
        width: 64px;
        height: 56px;
    }

    .sanli-search-result > i {
        display: none;
    }

    .sanli-lang__menu {
        right: auto;
        left: -10px;
    }
}

.sanli-header__nav .sanli-header__sub a.active {
    color: var(--color-text-inverse);
    background-color: color-mix(in srgb, var(--color-text-inverse), transparent 92%);
}

#smooth-content {
    overflow-x: clip;
}