﻿@charset "UTF-8";
/*!
 * Bootstrap v5.2.0-beta1 (https://getbootstrap.com/)
 * Copyright 2011-2022 The Bootstrap Authors
 * Copyright 2011-2022 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */


.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container-sm, .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container-md, .container-sm, .container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .container-lg, .container-md, .container-sm, .container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1140px;
  }
}
@media (min-width: 1400px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1320px;
  }
}
.row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-0.5 * var(--bs-gutter-x));
  margin-left: calc(-0.5 * var(--bs-gutter-x));
}
.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.col {
  flex: 1 0 0%;
}

.row-cols-auto > * {
  flex: 0 0 auto;
  width: auto;
}

.row-cols-1 > * {
  flex: 0 0 auto;
  width: 100%;
}

.row-cols-2 > * {
  flex: 0 0 auto;
  width: 50%;
}

.row-cols-3 > * {
  flex: 0 0 auto;
  width: 33.3333333333%;
}

.row-cols-4 > * {
  flex: 0 0 auto;
  width: 25%;
}

.row-cols-5 > * {
  flex: 0 0 auto;
  width: 20%;
}

.row-cols-6 > * {
  flex: 0 0 auto;
  width: 16.6666666667%;
}

.col-auto {
  flex: 0 0 auto;
  width: auto;
}

.col-1 {
  flex: 0 0 auto;
  width: 8.33333333%;
}

.col-2 {
  flex: 0 0 auto;
  width: 16.66666667%;
}

.col-3 {
  flex: 0 0 auto;
  width: 25%;
}

.col-4 {
  flex: 0 0 auto;
  width: 33.33333333%;
}

.col-5 {
  flex: 0 0 auto;
  width: 41.66666667%;
}

.col-6 {
  flex: 0 0 auto;
  width: 50%;
}

.col-7 {
  flex: 0 0 auto;
  width: 58.33333333%;
}

.col-8 {
  flex: 0 0 auto;
  width: 66.66666667%;
}

.col-9 {
  flex: 0 0 auto;
  width: 75%;
}

.col-10 {
  flex: 0 0 auto;
  width: 83.33333333%;
}

.col-11 {
  flex: 0 0 auto;
  width: 91.66666667%;
}

.col-12 {
  flex: 0 0 auto;
  width: 100%;
}

.offset-1 {
  margin-left: 8.33333333%;
}

.offset-2 {
  margin-left: 16.66666667%;
}

.offset-3 {
  margin-left: 25%;
}

.offset-4 {
  margin-left: 33.33333333%;
}

.offset-5 {
  margin-left: 41.66666667%;
}

.offset-6 {
  margin-left: 50%;
}

.offset-7 {
  margin-left: 58.33333333%;
}

.offset-8 {
  margin-left: 66.66666667%;
}

.offset-9 {
  margin-left: 75%;
}

.offset-10 {
  margin-left: 83.33333333%;
}

.offset-11 {
  margin-left: 91.66666667%;
}

.g-0,
.gx-0 {
  --bs-gutter-x: 0;
}

.g-0,
.gy-0 {
  --bs-gutter-y: 0;
}

.g-1,
.gx-1 {
  --bs-gutter-x: 0.25rem;
}

.g-1,
.gy-1 {
  --bs-gutter-y: 0.25rem;
}

.g-2,
.gx-2 {
  --bs-gutter-x: 0.5rem;
}

.g-2,
.gy-2 {
  --bs-gutter-y: 0.5rem;
}

.g-3,
.gx-3 {
  --bs-gutter-x: 1rem;
}

.g-3,
.gy-3 {
  --bs-gutter-y: 1rem;
}

.g-4,
.gx-4 {
  --bs-gutter-x: 1.5rem;
}

.g-4,
.gy-4 {
  --bs-gutter-y: 1.5rem;
}

.g-5,
.gx-5 {
  --bs-gutter-x: 3rem;
}

.g-5,
.gy-5 {
  --bs-gutter-y: 3rem;
}

@media (min-width: 576px) {
  .col-sm {
    flex: 1 0 0%;
  }

  .row-cols-sm-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-sm-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-sm-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-sm-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-sm-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-sm-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-sm-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-sm-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-sm-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-sm-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-sm-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-sm-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-sm-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-sm-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-sm-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-sm-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-sm-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-sm-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-sm-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-sm-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .offset-sm-0 {
    margin-left: 0;
  }

  .offset-sm-1 {
    margin-left: 8.33333333%;
  }

  .offset-sm-2 {
    margin-left: 16.66666667%;
  }

  .offset-sm-3 {
    margin-left: 25%;
  }

  .offset-sm-4 {
    margin-left: 33.33333333%;
  }

  .offset-sm-5 {
    margin-left: 41.66666667%;
  }

  .offset-sm-6 {
    margin-left: 50%;
  }

  .offset-sm-7 {
    margin-left: 58.33333333%;
  }

  .offset-sm-8 {
    margin-left: 66.66666667%;
  }

  .offset-sm-9 {
    margin-left: 75%;
  }

  .offset-sm-10 {
    margin-left: 83.33333333%;
  }

  .offset-sm-11 {
    margin-left: 91.66666667%;
  }

  .g-sm-0,
.gx-sm-0 {
    --bs-gutter-x: 0;
  }

  .g-sm-0,
.gy-sm-0 {
    --bs-gutter-y: 0;
  }

  .g-sm-1,
.gx-sm-1 {
    --bs-gutter-x: 0.25rem;
  }

  .g-sm-1,
.gy-sm-1 {
    --bs-gutter-y: 0.25rem;
  }

  .g-sm-2,
.gx-sm-2 {
    --bs-gutter-x: 0.5rem;
  }

  .g-sm-2,
.gy-sm-2 {
    --bs-gutter-y: 0.5rem;
  }

  .g-sm-3,
.gx-sm-3 {
    --bs-gutter-x: 1rem;
  }

  .g-sm-3,
.gy-sm-3 {
    --bs-gutter-y: 1rem;
  }

  .g-sm-4,
.gx-sm-4 {
    --bs-gutter-x: 1.5rem;
  }

  .g-sm-4,
.gy-sm-4 {
    --bs-gutter-y: 1.5rem;
  }

  .g-sm-5,
.gx-sm-5 {
    --bs-gutter-x: 3rem;
  }

  .g-sm-5,
.gy-sm-5 {
    --bs-gutter-y: 3rem;
  }
}
@media (min-width: 768px) {
  .col-md {
    flex: 1 0 0%;
  }

  .row-cols-md-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-md-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-md-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-md-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-md-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-md-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-md-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-md-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-md-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-md-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-md-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-md-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-md-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-md-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-md-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-md-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-md-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-md-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .offset-md-0 {
    margin-left: 0;
  }

  .offset-md-1 {
    margin-left: 8.33333333%;
  }

  .offset-md-2 {
    margin-left: 16.66666667%;
  }

  .offset-md-3 {
    margin-left: 25%;
  }

  .offset-md-4 {
    margin-left: 33.33333333%;
  }

  .offset-md-5 {
    margin-left: 41.66666667%;
  }

  .offset-md-6 {
    margin-left: 50%;
  }

  .offset-md-7 {
    margin-left: 58.33333333%;
  }

  .offset-md-8 {
    margin-left: 66.66666667%;
  }

  .offset-md-9 {
    margin-left: 75%;
  }

  .offset-md-10 {
    margin-left: 83.33333333%;
  }

  .offset-md-11 {
    margin-left: 91.66666667%;
  }

  .g-md-0,
.gx-md-0 {
    --bs-gutter-x: 0;
  }

  .g-md-0,
.gy-md-0 {
    --bs-gutter-y: 0;
  }

  .g-md-1,
.gx-md-1 {
    --bs-gutter-x: 0.25rem;
  }

  .g-md-1,
.gy-md-1 {
    --bs-gutter-y: 0.25rem;
  }

  .g-md-2,
.gx-md-2 {
    --bs-gutter-x: 0.5rem;
  }

  .g-md-2,
.gy-md-2 {
    --bs-gutter-y: 0.5rem;
  }

  .g-md-3,
.gx-md-3 {
    --bs-gutter-x: 1rem;
  }

  .g-md-3,
.gy-md-3 {
    --bs-gutter-y: 1rem;
  }

  .g-md-4,
.gx-md-4 {
    --bs-gutter-x: 1.5rem;
  }

  .g-md-4,
.gy-md-4 {
    --bs-gutter-y: 1.5rem;
  }

  .g-md-5,
.gx-md-5 {
    --bs-gutter-x: 3rem;
  }

  .g-md-5,
.gy-md-5 {
    --bs-gutter-y: 3rem;
  }
}
@media (min-width: 992px) {
  .col-lg {
    flex: 1 0 0%;
  }

  .row-cols-lg-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-lg-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-lg-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-lg-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-lg-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-lg-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-lg-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-lg-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-lg-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-lg-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-lg-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-lg-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-lg-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-lg-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-lg-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-lg-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-lg-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-lg-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .offset-lg-0 {
    margin-left: 0;
  }

  .offset-lg-1 {
    margin-left: 8.33333333%;
  }

  .offset-lg-2 {
    margin-left: 16.66666667%;
  }

  .offset-lg-3 {
    margin-left: 25%;
  }

  .offset-lg-4 {
    margin-left: 33.33333333%;
  }

  .offset-lg-5 {
    margin-left: 41.66666667%;
  }

  .offset-lg-6 {
    margin-left: 50%;
  }

  .offset-lg-7 {
    margin-left: 58.33333333%;
  }

  .offset-lg-8 {
    margin-left: 66.66666667%;
  }

  .offset-lg-9 {
    margin-left: 75%;
  }

  .offset-lg-10 {
    margin-left: 83.33333333%;
  }

  .offset-lg-11 {
    margin-left: 91.66666667%;
  }

  .g-lg-0,
.gx-lg-0 {
    --bs-gutter-x: 0;
  }

  .g-lg-0,
.gy-lg-0 {
    --bs-gutter-y: 0;
  }

  .g-lg-1,
.gx-lg-1 {
    --bs-gutter-x: 0.25rem;
  }

  .g-lg-1,
.gy-lg-1 {
    --bs-gutter-y: 0.25rem;
  }

  .g-lg-2,
.gx-lg-2 {
    --bs-gutter-x: 0.5rem;
  }

  .g-lg-2,
.gy-lg-2 {
    --bs-gutter-y: 0.5rem;
  }

  .g-lg-3,
.gx-lg-3 {
    --bs-gutter-x: 1rem;
  }

  .g-lg-3,
.gy-lg-3 {
    --bs-gutter-y: 1rem;
  }

  .g-lg-4,
.gx-lg-4 {
    --bs-gutter-x: 1.5rem;
  }

  .g-lg-4,
.gy-lg-4 {
    --bs-gutter-y: 1.5rem;
  }

  .g-lg-5,
.gx-lg-5 {
    --bs-gutter-x: 3rem;
  }

  .g-lg-5,
.gy-lg-5 {
    --bs-gutter-y: 3rem;
  }
}
@media (min-width: 1200px) {
  .col-xl {
    flex: 1 0 0%;
  }

  .row-cols-xl-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-xl-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-xl-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-xl-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-xl-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-xl-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-xl-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-xl-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-xl-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-xl-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-xl-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-xl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-xl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-xl-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-xl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-xl-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-xl-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-xl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-xl-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-xl-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .offset-xl-0 {
    margin-left: 0;
  }

  .offset-xl-1 {
    margin-left: 8.33333333%;
  }

  .offset-xl-2 {
    margin-left: 16.66666667%;
  }

  .offset-xl-3 {
    margin-left: 25%;
  }

  .offset-xl-4 {
    margin-left: 33.33333333%;
  }

  .offset-xl-5 {
    margin-left: 41.66666667%;
  }

  .offset-xl-6 {
    margin-left: 50%;
  }

  .offset-xl-7 {
    margin-left: 58.33333333%;
  }

  .offset-xl-8 {
    margin-left: 66.66666667%;
  }

  .offset-xl-9 {
    margin-left: 75%;
  }

  .offset-xl-10 {
    margin-left: 83.33333333%;
  }

  .offset-xl-11 {
    margin-left: 91.66666667%;
  }

  .g-xl-0,
.gx-xl-0 {
    --bs-gutter-x: 0;
  }

  .g-xl-0,
.gy-xl-0 {
    --bs-gutter-y: 0;
  }

  .g-xl-1,
.gx-xl-1 {
    --bs-gutter-x: 0.25rem;
  }

  .g-xl-1,
.gy-xl-1 {
    --bs-gutter-y: 0.25rem;
  }

  .g-xl-2,
.gx-xl-2 {
    --bs-gutter-x: 0.5rem;
  }

  .g-xl-2,
.gy-xl-2 {
    --bs-gutter-y: 0.5rem;
  }

  .g-xl-3,
.gx-xl-3 {
    --bs-gutter-x: 1rem;
  }

  .g-xl-3,
.gy-xl-3 {
    --bs-gutter-y: 1rem;
  }

  .g-xl-4,
.gx-xl-4 {
    --bs-gutter-x: 1.5rem;
  }

  .g-xl-4,
.gy-xl-4 {
    --bs-gutter-y: 1.5rem;
  }

  .g-xl-5,
.gx-xl-5 {
    --bs-gutter-x: 3rem;
  }

  .g-xl-5,
.gy-xl-5 {
    --bs-gutter-y: 3rem;
  }
}
@media (min-width: 1400px) {
  .col-xxl {
    flex: 1 0 0%;
  }

  .row-cols-xxl-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-xxl-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-xxl-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-xxl-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-xxl-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-xxl-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-xxl-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-xxl-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-xxl-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-xxl-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-xxl-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-xxl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-xxl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-xxl-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-xxl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-xxl-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-xxl-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-xxl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-xxl-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-xxl-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .offset-xxl-0 {
    margin-left: 0;
  }

  .offset-xxl-1 {
    margin-left: 8.33333333%;
  }

  .offset-xxl-2 {
    margin-left: 16.66666667%;
  }

  .offset-xxl-3 {
    margin-left: 25%;
  }

  .offset-xxl-4 {
    margin-left: 33.33333333%;
  }

  .offset-xxl-5 {
    margin-left: 41.66666667%;
  }

  .offset-xxl-6 {
    margin-left: 50%;
  }

  .offset-xxl-7 {
    margin-left: 58.33333333%;
  }

  .offset-xxl-8 {
    margin-left: 66.66666667%;
  }

  .offset-xxl-9 {
    margin-left: 75%;
  }

  .offset-xxl-10 {
    margin-left: 83.33333333%;
  }

  .offset-xxl-11 {
    margin-left: 91.66666667%;
  }

  .g-xxl-0,
.gx-xxl-0 {
    --bs-gutter-x: 0;
  }

  .g-xxl-0,
.gy-xxl-0 {
    --bs-gutter-y: 0;
  }

  .g-xxl-1,
.gx-xxl-1 {
    --bs-gutter-x: 0.25rem;
  }

  .g-xxl-1,
.gy-xxl-1 {
    --bs-gutter-y: 0.25rem;
  }

  .g-xxl-2,
.gx-xxl-2 {
    --bs-gutter-x: 0.5rem;
  }

  .g-xxl-2,
.gy-xxl-2 {
    --bs-gutter-y: 0.5rem;
  }

  .g-xxl-3,
.gx-xxl-3 {
    --bs-gutter-x: 1rem;
  }

  .g-xxl-3,
.gy-xxl-3 {
    --bs-gutter-y: 1rem;
  }

  .g-xxl-4,
.gx-xxl-4 {
    --bs-gutter-x: 1.5rem;
  }

  .g-xxl-4,
.gy-xxl-4 {
    --bs-gutter-y: 1.5rem;
  }

  .g-xxl-5,
.gx-xxl-5 {
    --bs-gutter-x: 3rem;
  }

  .g-xxl-5,
.gy-xxl-5 {
    --bs-gutter-y: 3rem;
  }
}


/*# sourceMappingURL=bootstrap.css.map */
/*
 Theme Name: Ulina
 Theme URI: https://uiuxom.com/ulina/html/
 Author: uiuxom
 Author URI: https://themeforest.net/user/uiuxom
 Description: Ulina - Fashion Ecommerce Responsive HTML Template
 Version: 1.0
 License:
 License URI: 
*/

/*==================================
    [Table of contents]
===================================
    01. Header
        01.1 Top Bar
    02. Sliders Section
    03. Icon Boxes
    04. Product Items
    05. Lookbooks
    06. Deal Product Section
    07. Product Tabs
    08. Category  Section
    09. Testimonial Section
    10. Blog Section
    11. Instagram Section
    12. Brand Section
    13. Footer
    14. CTA Section
    15. Subscribe Section
    16. Shop & Product Details Page
    17. Blog & Blog Details Page
    18. Utility Pages
    19. About Section
    20. Page Banner
    21. Contact Page
    22. Preloader
    23. Product Quickview
*/

/*-----------------------------------------
/  01. Header
/-----------------------------------------*/
.header01{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    width: 100%;
    height: auto;
    padding: 0 48px;
}
.header01.fixedHeader{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    background: #ecf5f4;
    z-index: 999;
    box-shadow: 0 0 50px 0 rgba(29,35,58,.08);
}
.header01.h01Mode2.fixedHeader{
    background: #FFF;
}
.h01Mode2{
    position: relative;
    padding: 0;
    left: auto;
    top: auto;
}
.blankHeader{
    height: 0;
}
.headerInner01{
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.headerInner02{
    display: flex;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: center;
    align-items: center;
}
.logo{
    position: relative;
    min-width: 13.4%;
    padding: 36px 0;
}
.headerInner02 .logo{
    flex: 1;
    margin: 0;
    padding: 27px 0;
}
.logo img{
    height: 48px;
    width: auto;
}
.headerInner02 .logo img{
    height: 42px;
    width: auto;
}
.mainMenu{
    font-family: 'Jost', sans-serif;
    position: relative;
    display: inline-flex;
    justify-content: flex-start;
}
.mainMenu ul{
    margin: 0;
    padding: 0;
    display: inline-flex;
}
.mainMenu ul li{
    list-style: none;
    position: relative;
}
.mainMenu > ul > li{
    padding: 51px 0 51px;
    margin: 0 55px 0 0;
    position: relative;
}
.headerInner02 .mainMenu > ul > li{
    padding: 0;
    padding: 38px 0 40px;
}
.mainMenu > ul > li:last-child{
    margin-right: 0;
}
.mainMenu ul li a{
    font-size: 18px;
    line-height: 1;
    color: #52586d;
    display: block;
    position: relative;
}
.mainMenu ul li.menu-item-has-children > a:after{
    content: '\f107';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    display: inline-block;
    position: relative;
    font-size: 12px;
    top: 1px;
    margin-left: 5px;

    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}
.mainMenu ul li:hover > a, .mainMenu ul li.current-menu-item > a{
    color: #9ebbbd;
}
.mainMenu ul li ul{
    position: absolute;
    display: block;
    top: calc(80% + 15px);
    left: 0;
    min-width: 220px;
    background: #fff;
    text-align: left;
    box-shadow: 0 0 50px 0 rgba(29, 35, 58, .08);
    padding: 15px 10px;
    opacity: 0;
    visibility: hidden;
    z-index: 99;
    border-radius: 10px;
    -webkit-transition: .3s;
    transition: .3s;
    pointer-events: none;
}
.mainMenu ul li ul li ul{
    left: calc(100% + 10px);
    top: calc(80% - 40px);
}
.mainMenu > ul li:hover > ul{
    pointer-events: inherit;
    visibility: visible;
    opacity: 1;
    top: 80%;
    pointer-events: auto;
}
.mainMenu ul li ul li:hover ul{
    top: calc(80% - 30px);
}
.mainMenu ul li ul li{
    display: block;
    display: block;
    margin: 0;
    width: 100%;
    padding: 8px 25px;
}
.mainMenu ul li ul li a{
    font-size: 16px;
    line-height: 24px;
    color: #52586d;
    display: inline;
    position: relative;
    font-weight: 400;

    -webkit-transition: all 0.35s linear;
    transition: all 0.35s linear;
    background: -webkit-gradient(linear,left top,left bottom,from(#9ebbbd),color-stop(98%,#9ebbbd));
    background: linear-gradient(to bottom,#9ebbbd 0%,#9ebbbd 98%);
    background-size: 0 1px;
    background-repeat: no-repeat;
    background-position: left 100%;
}
.mainMenu > ul > li > ul li:hover > a, .mainMenu > ul > li > ul li.active > a{
    background-size: 100% 1px;
    background-image: linear-gradient(to bottom,#9ebbbd 0%,#9ebbbd 98%);
}
.mainMenu ul li ul li.menu-item-has-children > a:after{
    display: none;
}
.mainMenu ul li ul li.menu-item-has-children:after{
    content: '\f105';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    display: inline-block;
    position: absolute;
    font-size: 12px;
    top: 9px;
    right: 9px;
    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}
.mainMenu ul li ul li.menu-item-has-children:hover:after,
.mainMenu ul li ul li.menu-item-has-children.active:after{
    color: #9ebbbd;
}
.megaMenu{
    position: absolute;
    display: block;
    top: calc(80% + 15px);
    left: 0;
    min-width: 720px;
    background: #fff;
    text-align: left;
    box-shadow: 0 0 50px 0 rgba(29,35,58,.08);
    padding: 28px 10px 15px;
    opacity: 0;
    visibility: hidden;
    z-index: 99;
    border-radius: 10px;
    -webkit-transition: .3s;
    transition: .3s;
    pointer-events: none;
}
.mainMenu > ul li:hover > .megaMenu{
    pointer-events: inherit;
    visibility: visible;
    opacity: 1;
    top: 80%;
    pointer-events: auto;
}
.mainMenu > ul li:hover > .megaMenu ul{
    pointer-events: auto;
}
.megaMenu .row .col-lg-4:first-of-type{
    width: 30%;
}
.megaMenu .row .col-lg-4:nth-child(2){
    width: 30%;
}
.megaMenu .row .col-lg-4:last-of-type{
    width: 40%;
    padding: 0 2px 0 0;
}
.megaMenu h3{
    font-size: 18px;
    line-height: 1;
    position: relative;
    margin: 0 24px 17px;
    font-weight: 500;
    padding: 0 0 3px;
}
.megaMenu h3:after{
    content: '';
    width: 35px;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #9ebbbd;
}
.mainMenu ul li .megaMenu ul{
    opacity: 1;
    visibility: visible;
    position: relative;
    left: auto;
    top: auto;
    min-width: 100%;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    transform: rotateX(0deg);
    transform-origin: 0% 0%;
    -webkit-transform-origin: 0% 0%;
    -moz-transform-origin: 0% 0%;
    -ms-transform-origin: 0% 0%;
    -o-transform-origin: 0% 0%;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -webkit-transition: none;
    transition: none;
}
.mainMenu ul li .megaMenu ul li:hover > a, .mainMenu ul li .megaMenu ul.active > a{
    background-size: 100% 1px;
    background-image: linear-gradient(to bottom,#9ebbbd 0%,#9ebbbd 98%);
}
.megaMenu .lookBook01.lb01M2{
    margin: -28px 0 -15px;
    border-radius: 0 10px 10px 0;
    padding: 36px 0 0 0;
}
.megaMenu .lbContent{
    position: absolute;
    top: 0px;
    padding: 77px 0 0 30px;
    max-width: 70%;
    text-align: left;
}
.megaMenu .lb01M2:after{
    top: auto;
    bottom: -46px;
    right: -49px;
    width: 186px;
    height: 186px;
}
.megaMenu .lbContent h2{
    font-size: 24px;
    line-height: 36px;
    color: #52586d;
    margin: 0 0 19px;
}
.megaMenu .lookBook01 img{
    max-width: 45%;
    height: auto;
    position: relative;
    z-index: 2;
    margin: 43px 0 0;
    display: inline-block;
}
.megaMenu .lbContent h3:after{
    display: none;
}
.mainMenu ul li a.ulinaLink{
    font-size: 14px;
}
.mainMenu ul li a.ulinaLink i{
    font-size: 12px;
    top: 0px;
}
.menuToggler{
    display: none;
}


.accessNav{
    display: inline-flex;
    justify-content: flex-end;
    margin: 0 0 0 auto;
}
.headerInner02 .accessNav{
    display: flex;
    flex: 1;
    justify-content: flex-end;
    margin: 0;
}
.anSocial{
    position: relative;
    display: inline-flex;
    margin: 51px 25px 51px 0px;
}
.ansWrap{
    display: inline-flex;
}
.anSocial a{
    font-size: 18px;
    line-height: 1;
    color: #52586d;
    margin: 0 24px 0 0;
}
.anSocial a:last-child{
    margin: 0;
}
.anSocial a.fac{
    color: #1877f2;
}
.anSocial a.twi{
    color: #1da1f2;
}
.anSocial a.lin{
    color: #0077b5;
}
.anSocial a.ins{
    color: #405de6;
}
.anSocial a:hover{
    color: #9ebbbd;
}
.anSocial a.tog{
    display: none;
}
.anSelects{
    display: inline-flex;
    justify-content: flex-start;
    position: relative;
    padding: 0 0 0 23px;
    margin: 51px 24px 51px 0;
}
.anSelects:before{
    content: '';
    position: absolute;
    left: 0;
    top: 4px;
    height: 12px;
    width: 1px;
    background: #bcbcbc;
}
.anSelect{
    position: relative;
    margin: 0 16px 0 0;
}
.anSelects .anSelect:last-of-type{
    margin: 0;
}
.anSelect .nice-select{
    font-size: 16px;
    line-height: 18px;
    color: #7f8495;
    text-transform: uppercase;
    padding: 0 18px 0 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    height: auto;
}
.anSelect .nice-select:after{
    content: '\f107';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 12px;
    color: #7f8495;
    border: none;
    margin: 0;
    top: 1px;
    transform: none;
    width: auto;
    height: auto;
    left: auto;
    right: 1px;
    transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
}
.anSelect .nice-select.open:after{
    content: '\f106';
}
.anSelect .nice-select .list{
    margin: 10px 0 0;
    border-radius: 3px;
    border: none;
    box-shadow: none;
    min-width: 80px;
}
.anSelect .nice-select .list .option{
    font-size: 16px;
    color: #7f8495;
    text-transform: uppercase;
    padding: 0 15px;
    line-height: 40px;
}
.anSelect .nice-select .option:hover, .anSelect .nice-select .option.focus, .anSelect .nice-select .option.selected.focus{
    background-color: #9ebbbd !important;
    color: #FFF !important;
}
.anItems{
    position: relative;
    display: inline-flex;
    padding: 0 0 0 24px;
    margin: 49px 0 47px;
}
.headerInner02 .anItems{
    padding: 0;
    margin: 37px 0 35px;
}
.headerInner02 .anItems:before{
    display: none;
}
.anItems:before{
    content: '';
    position: absolute;
    left: 0;
    top: 4px;
    height: 12px;
    width: 1px;
    background: #bcbcbc;
}
.anItems > div{
    position: relative;
    margin-right: 24px;
}
.anItems > div:last-of-type{
    margin: 0;
}
.anItems > div > a{
    font-size: 18px;
    line-height: 1;
    color: #52586d;
}
.anItems > div > a:hover{
    color: #9ebbbd;
}
.anItems > div.anCart > a span{
    height: 18px;
    width: 18px;
    position: absolute;
    right: -12px;
    top: -10px;
    background: #f04726;
    color: #FFF;
    border-radius: 50%;
    text-align: center;
    line-height: 18px;
    font-size: 12px;

    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}
.anItems > div.anCart > a:hover span{
    background: #52586d;
}
.anSupport{
    position: relative;
    padding: 0 0 0 53px;
    margin: 42px 0 40px 49px;
}
.anSupport i{
    position: absolute;
    left: 0;
    top: 1px;
    font-size: 36px;
    color: #4a5556;
    line-height: 1;
}
.anSupport h3{
    font-size: 16px;
    line-height: 1;
    margin: 0;
}
.anSupport h3:first-of-type{
    margin: 0 0 6px;
}
.anItems > div.anCart:hover .cartWidgetArea{
    pointer-events: inherit;
    visibility: visible;
    opacity: 1;
    -webkit-transform: rotatex(0deg);
    -moz-transform: rotatex(0deg);
    transform: rotatex(0deg);
}
.cartWidgetArea{
    position: absolute;
    display: block;
    top: calc(100% + 23px);
    right: -30px;
    width: 300px;
    background: #fff;
    text-align: left;
    box-shadow: 0 0 50px 0 rgba(29, 35, 58, .08);
    padding: 30px 30px;
    opacity: 0;
    visibility: hidden;
    z-index: 99;
    border-radius: 10px;
    -webkit-transform: rotateX(-75deg);
    -moz-transform: rotateX(-75deg);
    transform: rotateX(-75deg);
    transform-origin: 0% 0%;
    -webkit-transform-origin: 0% 0%;
    -moz-transform-origin: 0% 0%;
    -ms-transform-origin: 0% 0%;
    -o-transform-origin: 0% 0%;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -webkit-transition: .4s;
    transition: .4s;
}
.fixedHeader .cartWidgetArea{
    top: calc(100% + 34px);
}
.h01Mode2.fixedHeader .cartWidgetArea{
    top: calc(100% + 24px);
}
.cartWidgetProduct{
    position: relative;
    min-height: 60px;
    text-align: left;
    padding-left: 74px;
    margin-bottom: 25px;
    padding-right: 15px;
}
.cartWidgetArea .cartWidgetProduct:last-of-type{
    margin-bottom: 19px;
}
.cartWidgetProduct img{
    width: 60px;
    height: 70px;
    position: absolute;
    border-radius: 3px;
    left: 0;
    top: 0;
}
.cartWidgetProduct a{
    font-family: 'Jost', sans-serif;
    display: block;
    font-size: 16px;
    line-height: 20px;
    position: relative;
    bottom: auto;
    color: #52586d;
    margin: 0 0 6px;
    top: -2px;
}
.cartWidgetProduct a:hover{
    color: #9ebbbd;
}
.cartWidgetProduct .cartProductPrice{
    font-family: 'Jost', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #7b9496;
    line-height: 1;
}
.cartWidgetProduct .cartRemoveProducts{
    font-size: 10px;
    color: #7f8495;
    position: absolute;
    right: -8px;
    top: 0px;
    margin: 0;
    width: 19px;
    height: 19px;
    border: 1px solid #c5d0cf;
    border-radius: 50%;
    text-align: center;
    line-height: 18px;
    padding: 0px 0 0 1px;
}
.cartWidgetProduct .cartRemoveProducts:hover{
    color: #FFF;
    border-color: #9ebbbd;
    background: #9ebbbd;
}
.totalPrice{
    font-family: 'Jost', sans-serif;
    position: relative;
    display: inline-block;
    font-size: 18px;
    line-height: 1;
    color: #52586d;
    text-align: left;
    font-weight: 500;
    width: 100%;
    text-transform: capitalize;
    margin: 0 0 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid #c5d0cf;
}
.totalPrice .price{
    float: right;
    color: #7b9496;
}
.cartWidgetBTN{
    position: relative;
    text-align: left;
}
.cartWidgetBTN a{
    font-family: 'Jost', sans-serif;
    display: inline-block;
    position: relative;
    height: 35px;
    min-width: 10px;
    background: #9ebbbd;
    border-radius: 35px;
    font-size: 12px;
    line-height: 36px;
    color: #FFF;
    font-weight: 500;
    text-transform: uppercase;
    text-align: center;
    overflow: hidden;
    border: none;
    float: left;
    padding: 0 20px;
}
.cartWidgetBTN a.checkout{
    float: right;
}
.cartWidgetBTN a:hover{
    background: #52586d;
    color: #FFF;
}


/*-----------------------------------------
/  01.1 Top Bar
/-----------------------------------------*/
.topbarSection{
    position: relative;
}
.tbInfo{
    font-size: 14px;
    line-height: 28px;
    color: #7f8495;
    padding: 6px 0px 7px;
}
.tbInfo > i{
    color: #9ebbbd;
    margin-right: 8px;
}
.tbInfo .ulinaLink{
    font-size: 12px;
    margin-left: 13px;
}
.tbInfo .ulinaLink i{
    top: 0;
    margin-right: 6px;
}
.tbAccessNav{
    display: flex;
    justify-content: flex-end;
}
.tbAccessNav .anSocial{
    margin: 14px 23px 11px 0px;
}
.tbAccessNav .anSocial a{
    font-size: 16px;
    margin-right: 21px;
}
.tbAccessNav .anSocial a:last-child{
    margin-right: 0;
}
.tbAccessNav .anSelects{
    margin: 12px 0 11px;
}
.tbAccessNav .anSelect .nice-select{
    font-size: 14px;
}
.tbAccessNav .anSelect .nice-select .list .option{
    font-size: 14px;
}
.tbBar{
    height: 1px;
    background: #dbdfe3;
}


/*-----------------------------------------
/  03. Icon Boxes
/-----------------------------------------*/
.iconBox01{
    position: relative;
    padding: 0 0 0 84px;
}
.iconBox01 i{
    font-size: 61px;
    line-height: 1;
    position: absolute;
    left: 0;
    top: -11px;
    color: #9ebbbd;
}
.ib01LightMode i{
    color: #FFF;
}
.iconBox01 i.tm5{
    top: -5px;
}
.iconBox01 i.tm1{
    top: -1px;
}
.iconBox01 i.t1{
    top: 1px;
}
.iconBox01 h3{
    font-size: 24px;
    line-height: 1;
    margin: 0 0 20px;
}
.ib01LightMode h3{
    color: #FFF;
}
.iconBox01 p{
    margin: 0;
}
.ib01LightMode p{
    color: #FFF;
}

/*-----------------------------------------
/  04. Product Items
/-----------------------------------------*/
.productItem01{
    position: relative;
}
.pi01Thumb{
    position: relative;
    overflow: hidden;
    border-radius: 3px;
    background: #FFF;
    margin: 0 0 17px;
}
.pi01NoRating .pi01Thumb{
    margin: 0 0 13px;
}
.pi01Thumb img{
    width: 100%;
    height: auto;
    display: block;
    border-radius: 3px;
    position: relative;
    left: 0%;

    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}
.pi01Thumb img:nth-child(2){
    position: absolute;
    left: 100%;
    top: 0;
}
.productItem01:hover .pi01Thumb img{
    opacity: .64;
}
.productItem01:hover .pi01Thumb img:first-child{
    left: -100%;
}
.productItem01:hover .pi01Thumb img:nth-child(2){
    left: 0%;
}
.productLabels{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    width: 100%;
    padding: 12px;
}
.productLabels span{
    float: left;
    font-size: 12px;
    line-height: 26px;
    height: 26px;
    text-align: center;
    text-transform: uppercase;
    color: #FFF;
    background: #7b9496;
    border-radius: 3px;
    padding: 0 8px;
    margin: 0 0 5px;
}
.productLabels span:nth-child(even){
    float: right;
}
.productLabels span.plDis{
    background: #f04726;
}
.productLabels span.plHot{
    background: #f04726;
}
.pi01Actions{
    position: absolute;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    top: 50%;
    transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}
.pi01Actions a{
    width: 48px;
    height: 48px;
    background: #FFF;
    border-radius: 50%;
    text-align: center;
    line-height: 50px;
    font-size: 16px;
    color: #7b9496;
    margin: 0 4px;
    opacity: 0;
    visibility: hidden;
}
.pi01Actions a.pi01QuickView i{
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.pi01Actions a:nth-child(01){
    -webkit-transition: transform 400ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -moz-transition: transform 400ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -ms-transition: transform 400ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -o-transition: transform 400ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    transition: transform 400ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;

    transform: translate3d(0, 60px, 0);
    -moz-transform: translate3d(0, 60px, 0);
    -webkit-transform: translate3d(0, 60px, 0);
    -ms-transform: translate3d(0, 60px, 0);
    -o-transform: translate3d(0, 60px, 0);
}
.pi01Actions a:nth-child(02){
    -webkit-transition: transform 500ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -moz-transition: transform 500ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -ms-transition: transform 500ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -o-transition: transform 500ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    transition: transform 500ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;

    transform: translate3d(0, 60px, 0);
    -moz-transform: translate3d(0, 60px, 0);
    -webkit-transform: translate3d(0, 60px, 0);
    -ms-transform: translate3d(0, 60px, 0);
    -o-transform: translate3d(0, 60px, 0);
}
.pi01Actions a:nth-child(03){
    -webkit-transition: transform 600ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -moz-transition: transform 600ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -ms-transition: transform 600ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -o-transition: transform 600ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    transition: transform 600ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;

    transform: translate3d(0, 60px, 0);
    -moz-transform: translate3d(0, 60px, 0);
    -webkit-transform: translate3d(0, 60px, 0);
    -ms-transform: translate3d(0, 60px, 0);
    -o-transform: translate3d(0, 60px, 0);
}
.pi01Actions a:nth-child(04){
    -webkit-transition: transform 700ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -moz-transition: transform 700ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -ms-transition: transform 700ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    -o-transition: transform 700ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;
    transition: transform 700ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 350ms, visibility ease 350ms, background ease 350ms, color ease 350ms, border ease 350ms;

    transform: translate3d(0, 60px, 0);
    -moz-transform: translate3d(0, 60px, 0);
    -webkit-transform: translate3d(0, 60px, 0);
    -ms-transform: translate3d(0, 60px, 0);
    -o-transform: translate3d(0, 60px, 0);
}
.productItem01:hover .pi01Actions a:nth-child(01),
.productItem01:hover .pi01Actions a:nth-child(02),
.productItem01:hover .pi01Actions a:nth-child(03),
.productItem01:hover .pi01Actions a:nth-child(04),

.productItem02:hover .pi01Actions a:nth-child(01),
.productItem02:hover .pi01Actions a:nth-child(02),
.productItem02:hover .pi01Actions a:nth-child(03),
.productItem02:hover .pi01Actions a:nth-child(04){
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
}
.pi01Actions a:hover{
    background: #7b9496;
    color: #FFF;
}
.pi01Details{
    position: relative;
}
.productRatings{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin: 0 0 8px;
}
.productRatingWrap .star-rating{
    font-family: 'Font Awesome 6 Free';
    float: none;
    overflow: hidden;
    position: relative;
    height: auto;
    line-height: 1;
    font-size: 12px;
    width: auto;
    margin: 0;
}
.productRatingWrap .star-rating::before{
    content: "\f005\f005\f005\f005\f005";
    font-weight: 400;
    color: #ffb400;
    float: left;
    position: relative;
    display: inline-block;
}
.productRatingWrap .star-rating span{
    overflow: hidden;
    float: left;
    top: 0;
    left: 0;
    position: absolute;
    width: 90%;
    height: 100%;
}
.productRatingWrap .star-rating span::before{
    content: "\f005\f005\f005\f005\f005";
    font-weight: 900;
    color: #ffb400;
    top: 0;
    position: absolute;
    left: 0;
}
.ratingCounts{
    font-size: 13px;
    line-height: 1;
    color: #aeb3c3;
    margin: 0 0 0 11px;
}
.pi01Details h3{
    font-size: 21px;
    line-height: 30px;
    margin: 0;
}
.pi01Details h3 a{
    color: inherit;
}
.pi01Details h3 a:hover{
    color: #7f8495;
}
.pi01Price{
    font-family: 'Jost', sans-serif;
    display: flex;
    justify-content: flex-start;
    align-items: center;

    font-size: 21px;
    line-height: 30px;
    font-weight: 500;
    color: #7b9496;
    text-decoration: none;
    margin: 0 0 6px;
}
.pi01Price ins{
    text-decoration: none;
}
.pi01Price del{
    font-size: 16px;
    color: #aeb3c3;
    position: relative;
    text-decoration: none;
    padding: 0 6px;
    line-height: 1;
    margin: 0 0 0 13px;
    font-weight: 400;
}
.pi01Price del:after{
    content: '';
    position: absolute;
    left: 0;
    top: 7px;
    width: 100%;
    height: 1px;
    background: #aeb3c3;
    margin: 0;
}
.pi01Variations{
    display: flex;
    justify-content: space-between;
}
.pi01VColor{
    display: inline-flex;
    justify-content: flex-start;
    padding: 4px 0 0px;
}
.pi01VCItem{
    position: relative;
    margin: 0 11px 0 0;
}
.pi01VCItem input[type="radio"]{
    opacity: 0;
    visibility: hidden;
    width: 0;
    height: 0;
    position: absolute;
}
.pi01VCItem label{
    position: relative;
    width: 18px;
    height: 18px;
    border: 1px solid transparent;
    cursor: pointer;
    border-radius: 50%;

    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}
.pi01VCItem input[type="radio"]:checked + label{
    border-color: #dbdfe3
}
.pi01VCItem label:after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #52a9e8;

    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}
.pi01VCItem input[type="radio"]:checked + label:after{
    width: 10px;
    height: 10px;
}
.pi01VCItem.yellows label:after{
    background: #f2c864;
}
.pi01VCItem.reds label:after{
    background: #f42222;
}
.pi01VSize{
    display: inline-flex;
    justify-content: flex-end;
}
.pi01VSItem{
    position: relative;
    margin: 0 0 0 6px;
}
.pi01VSItem input[type="radio"]{
    opacity: 0;
    visibility: hidden;
    width: 0;
    height: 0;
    position: absolute;
}
.pi01VSItem label{
    border: 1px solid #dbdfe3;
    border-radius: 2px;
    font-size: 14px;
    font-weight: 400;
    color: #7f8495;
    line-height: 22px;
    cursor: pointer;
    padding: 0 6px;

    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}
.pi01VSItem input[type="radio"]:checked + label{
    color: #52586d;
    border-color: #52586d;
}

.productCarousel.owl-carousel .owl-nav button.owl-next, .productCarousel.owl-carousel .owl-nav button.owl-prev{
    font-size: 18px;
    color: #9ebbbd;
    border: 1px solid #c5d0cf;
    width: 42px;
    height: 42px;
    line-height: 40px;
    text-align: center;
    border-radius: 50%;
}
.productCarousel.owl-carousel .owl-nav button.owl-next{
    margin-left: 6px;
}
.productCarousel.owl-carousel .owl-nav{
    position: absolute;
    right: 0;
    top: -90px;
}
.productCarousel.owl-carousel .owl-nav button.owl-next:hover, .productCarousel.owl-carousel .owl-nav button.owl-prev:hover{
    color: #7b9496;
    border-color: #7b9496;
}

/*-----------------------------------------
/  05. Lookbooks
/-----------------------------------------*/
.lookBook01{
    position: relative;
    background: #eeeeee;
    border-radius: 5px;
    overflow: hidden;
    text-align: right;
    padding: 39px 32px 0 0;
    margin: 0 0 24px;
}
.overLayAnim01::before {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: block;
    content: '';
    width: 0;
    height: 0;
    background: rgba(255,255,255,.45);
    border-radius: 100%;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    -khtml-border-radius: 100%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
}
.overLayAnim01:hover::before {
    -webkit-animation: circle .75s;
    animation: circle .75s;
}
@-webkit-keyframes circle {
    0% {
        opacity: 1;
    }
    40% {
        opacity: 1;
    }
    100% {
        width: 200%;
        height: 200%;
        opacity: 0;
    }
}
@keyframes circle {
    0% {
        opacity: 1;
    }
    40% {
        opacity: 1;
    }
    100% {
        width: 200%;
        height: 200%;
        opacity: 0;
    }
}
.overLayAnim02::before {
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.7) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.7) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg);
}
.overLayAnim02:hover::before {
    -webkit-animation: shine .75s;
    animation: shine .75s;
}
@-webkit-keyframes shine {
    100% {
        left: 125%;
    }
}
@keyframes shine {
    100% {
        left: 125%;
    }
}
.overLayAnim03::before {
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.4) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.4) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg);
}
.overLayAnim03:hover::before {
    -webkit-animation: shine2 .75s;
    animation: shine2 .75s;
}
@-webkit-keyframes shine2 {
    100% {
        left: 125%;
    }
}
@keyframes shine2 {
    100% {
        left: 125%;
    }
}


.lb01M1{
    text-align: center;
    padding: 0;
}
.lb01M2{
    padding-top: 27px;
    padding-right: 0;
}
.lb01M3{
    padding: 0;
    text-align: center;
}
.lb01M4{
    padding: 0 0 53px;
    text-align: center;
}
.lb01M5{
    padding: 160px 3px 2px 0;
}
.lb01M6, .lb01M7, .lb01M8, .lb01M9, .lb01M10{
    position: relative;
    background: transparent;
    padding: 0;
}
.lb01M11{
    padding: 48px 30px 31px;
}
.lookBook01:after{
    content: '';
    width: 286px;
    height: 286px;
    background: #ddecea;
    border-radius: 0;
    border-radius: 50%;
    position: absolute;
    bottom: -50px;
    right: -65px;
}
.lb01M1:after{
    content: '';
    width: 320px;
    height: 320px;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -25px;
    background: #ddecea;
    border-radius: 50%;
    margin: 0 auto;
}
.lb01M3:after{
    width: 215px;
    height: 215px;
    left: 110px;
    right: auto;
    top: 93px;
    margin: 0;
}
.lb01M4:after{
    width: 215px;
    height: 215px;
    left: 106px;
    right: auto;
    top: auto;
    bottom: 39px;
    margin: 0;
}
.lb01M5:after{
    width: 281px;
    height: 281px;
    top: auto;
    bottom: -86px;
    right: -69px;
}
.lb01M2:after{
    bottom: auto;
    top: -91px;
    right: -98px
}
.lb01M6:after, .lb01M7:after, .lb01M8:after, .lb01M9:after, .lb01M10:after, .lb01M11:after{
    display: none;
}
.lookBook01 img{
    max-width: 100%;
    height: auto;
    position: relative;
    z-index: 2;
}
.lb01M1 img{
    max-width: 100%;
    height: auto;
}
.lb01M3 img{
    margin: 0 0 65px;
}
.lb01M6 img,
.lb01M7 img,
.lb01M8 img,
.lb01M9 img,
.lb01M10 img{
    width: 100%;
    height: auto;
    z-index: 1;
    border-radius: 5px;
}
.lbContent{
    position: absolute;
    top: 0px;
    padding: 49px 0 0 49px;
    max-width: 70%;
    text-align: left;
}
.lb01M6 .lbContent{
    z-index: 2;
    max-width: 60%;
    padding: 0 0 0 72px;
    top: 145px;
    bottom: auto;
}
.lb01M1 .lbContent{
    position: relative;
    text-align: center;
    max-width: 100%;
    padding: 49px 49px 35px;
}
.lb01M3 .lbContent{
    position: relative;
    left: auto;
    top: auto;
    padding: 0 50px 43px;
    max-width: 100%;
    text-align: center;
}
.lb01M4 .lbContent{
    position: relative;
    padding: 49px 49px 36px;
    max-width: 100%;
    text-align: center;
}
.lb01M5 .lbContent{
    z-index: 2;
}
.lb01M7 .lbContent{
    z-index: 4;
    max-width: 60%;
    padding: 48px 0 0 49px;
    top: 0px;
    bottom: auto;
}
.lb01M8 .lbContent{
    z-index: 4;
    max-width: 60%;
    padding: 0 45px 43px 0;
    top: auto;
    bottom: 0px;
    left: auto;
    right: 0px;
    text-align: right;
}
.lb01M9 .lbContent{
    z-index: 4;
    max-width: 60%;
    padding: 48px 47px 0 0;
    top: 0;
    bottom: auto;
    left: auto;
    right: 0px;
    text-align: right;
}
.lb01M10 .lbContent{
    z-index: 4;
    max-width: 60%;
    padding: 48px 0 0 48px;
    top: 0;
    bottom: auto;
    left: 0;
    text-align: left;
}
.lb01M11 .lbContent{
    z-index: 4;
    max-width: 100%;
    padding: 0;
    top: auto;
    bottom: auto;
    left: auto;
    text-align: center;
    position: relative;
    margin: 0 0 23px;
}
.lbContent h3{
    font-size: 16px;
    color: #7b9496;
    line-height: 1;
    font-weight: 500;
    margin: 0 0 9px;
}
.lbContent h2{
    font-size: 36px;
    line-height: 48px;
    color: #52586d;
    margin: 0 0 11px;
}
.lb01M11 .lbContent h2{
    margin: 0 0 23px;
}
.lb01M7 .lbContent h2,
.lb01M7 .lbContent h3,
.lb01M10 .lbContent h2,
.lb01M10 .lbContent h3{
    color: #FFF;
}
.lb01M7 .ulinaLink,
.lb01M10 .ulinaLink{
    color: #FFF;
}
.lb01M7 .ulinaLink i,
.lb01M10 .ulinaLink i{
    color: #FFF;
}
.lb01M11Img{
    position: relative;
    display: block;
    text-align: center;
    margin: 0 0 21px;
}
.lb01M11Img img{
    display: inline-block;
    position: relative;
    z-index: 2;
}
.lb01M11Img:after{
    content: '';
    width: 148px;
    height: 148px;
    border-radius: 50%;
    background: #ddecea;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 2px;
    margin: 0 auto;
}
.lb01M11 .pi01Price{
    justify-content: center;
    font-size: 30px;
    color: #7b9496;
    margin: 0 0 20px;
}
.lb01M11 .pi01Price del{
    font-size: 21px;
    line-height: 1;
    color: #52586d;
    margin-left: 16px;
}
.lb01M11 .pi01Price del:after{
    background: #52586d;
    top: 9px;
}
.lb01M11 .countDownWrap{
    text-align: center;
}
.lb01M11 .countDownWrap h6{
    text-align: center;
    margin: 0 0 17px;
}
.lb01M11 .ulinaCountDown .countdown-row span{
    display: inline-block;
    width: 60px;
    margin-right: 24px;
}
.lb01M11 .ulinaCountDown .countdown-row span span:first-child{
    position: relative;
    display: block;
    height: 60px;
    width: 60px;
    background: #FFF;
    font-size: 24px;
    color: #52586d;
    line-height: 60px;
    text-align: center;
    font-weight: 400;
    border-radius: 50%;
    margin: 0 0 6px;
}
.lb01M11 .ulinaCountDown .countdown-row span span:first-child:after{
    content: ':';
    font-size: 24px;
    line-height: 1;
    color: #52586d;
    position: absolute;
    right: -18px;
    top: 16px;
}
.discountLabel{
    font-size: 24px;
    line-height: 30px;
    font-weight: 500;
    color: #fff;
    text-align: center;
    height: 90px;
    width: 90px;
    border-radius: 50%;
    background: #f04726;
    padding: 14px 15px 0;
    text-transform: uppercase;
}
.lb01M7 .discountLabel{
    position: absolute;
    right: 24px;
    bottom: 24px;
    z-index: 2;
}
.lb01M10 .discountLabel{
    position: absolute;
    right: 137px;
    bottom: 43px;
    z-index: 2;
    margin: 0 0 15px;
}
.lb01M10 .ulinaCountDown .countdown-row span:last-child span:first-child:after{
    list-style: none;
}


/*-----------------------------------------
/  08. Category  Section
/-----------------------------------------*/
.categoryItem01{
    position: relative;
    overflow: hidden;
}
.ci01Thumb{
    position: relative;
    overflow: hidden;
    border-radius: 5px;
    margin: 0 0 21px;
    background: #9ebbbd;
}
.categoryItem01.ci01Mode2 .ci01Thumb{
    width: 190px;
    height: 190px;
    border-radius: 190px;
    -moz-border-radius: 190px;
    -webkit-border-radius: 190px;
    -khtml-border-radius: 190px;
    margin: 0 auto 21px;
    overflow: hidden;
    z-index: 2;
}
.categoryItem01 img{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 5px;

    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}
.categoryItem01.ci01Mode2 .ci01Thumb img{
    width: 100%;
    height: 100%;
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    -khtml-border-radius: 0px;
    z-index: -2;
}
.categoryItem01:hover .ci01Thumb img{
    transform: rotate(-2deg) scale(1.04);
    -moz-transform: rotate(-2deg) scale(1.04);
    -webkit-transform: rotate(-2deg) scale(1.04);
}
.categoryItem01.ci01Mode2:hover  .ci01Thumb img{
    transform: rotate(-5deg) scale(1.06);
    -moz-transform: rotate(-5deg) scale(1.06);
    -webkit-transform: rotate(-5deg) scale(1.06);
}
.categoryItem01 h3{
    font-size: 24px;
    line-height: 28px;
    margin: 0 0 9px;
}
.categoryItem01 h3 a{
    color: inherit;
}
.categoryItem01 h3 a:hover{
    color: #7f8495;
}
.categoryItem01 p{
    font-size: 13px;
    line-height: 1;
    color: #aeb3c3;
    margin: 0;
}
.categoryCarousel.owl-carousel .owl-nav button.owl-next, .categoryCarousel.owl-carousel .owl-nav button.owl-prev,
.categoryCarousel2.owl-carousel .owl-nav button.owl-next, .categoryCarousel2.owl-carousel .owl-nav button.owl-prev{
    font-size: 18px;
    color: #9ebbbd;
    border: 1px solid #c5d0cf;
    width: 42px;
    height: 42px;
    line-height: 40px;
    text-align: center;
    border-radius: 50%;
}
.categoryCarousel.owl-carousel .owl-nav button.owl-next,
.categoryCarousel2.owl-carousel .owl-nav button.owl-next{
    margin-left: 6px;
}
.categoryCarousel.owl-carousel .owl-nav,
.categoryCarousel2.owl-carousel .owl-nav{
    position: absolute;
    right: 0;
    top: -90px;
}
.categoryCarousel2.owl-carousel .owl-nav button.owl-next:hover, .categoryCarousel2.owl-carousel .owl-nav button.owl-prev:hover,
.categoryCarousel.owl-carousel .owl-nav button.owl-next:hover, .categoryCarousel.owl-carousel .owl-nav button.owl-prev:hover{
    color: #7b9496;
    border-color: #7b9496;
}


/*-----------------------------------------
/  10. Blog Section
/-----------------------------------------*/
.blogItem01{
    position: relative;
    overflow: hidden;
    border-radius: 5px;
}
.blogItem01 img{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 5px;

    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}
.blogItem01:hover img{
    transform: rotate(-2deg) scale(1.06);
    -moz-transform: rotate(-2deg) scale(1.06);
    -webkit-transform: rotate(-2deg) scale(1.06);
}
.blogItem01:after{
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background: url(../images/bg/2.png) repeat-x left bottom;
    z-index: 2;
}
.bi01Content{
    position: absolute;
    left: 0;
    bottom: 37px;
    z-index: 3;
    padding: 0 48px;
}
.bi01Meta{
    font-size: 14px;
    line-height: 30px;
    color: #FFF;
    margin: 0 0 1px;
}
.bi01Meta span{
    float: left;
    margin: 0 19px 0 0;
}
.bi01Meta span a{
    color: inherit;
}
.bi01Meta span a:hover{
    color: #9ebbbd;
}
.bi01Meta span i{
    margin: 0 9px 0 0;
}
.bi01Content h3{
    font-size: 30px;
    line-height: 48px;
    color: #FFF;
    margin: 0 0 0;
}
.bi01Content h3 a{
    color: inherit;
}
.bi01Content h3 a:hover{
    color: #9ebbbd;
}
.blogItem02{
    position: relative;
    border-radius: 5px;
    border: 1px solid #dbdfe3;
    min-height: 260px;
    padding: 21px 29px 0;
    margin: 0 0 24px;
}
.blogItem02 .bi01Meta{
    color: #7f8495;
}
.blogItem02 .bi01Meta span i{
    color: #9ebbbd;
}
.blogItem02 h3{
    font-size: 21px;
    line-height: 30px;
    color: #52586d;
    position: relative;
    top: -1px;
    margin: 0;
}
.blogItem02 h3 a{
    color: inherit;
}
.blogItem02 h3 a:hover{
    color: #7f8495;
}
.blogItem02 .ulinaLink{
    position: absolute;
    left: 29px;
    bottom: 28px;
}
.blogItem03{
    position: relative;
}
.bi03Thumb{
    position: relative;
    border-radius: 5px;
    margin: 0 0 16px;
    overflow: hidden;
}
.blogItem03 img{
    width: 100%;
    height: auto;
    border-radius: 5px;

    transition: all ease 350ms;
    -moz-transition: all ease 350ms;
    -webkit-transition: all ease 350ms;
}
.blogItem03:hover img{
    transform: rotate(-2deg) scale(1.06);
    -moz-transform: rotate(-2deg) scale(1.06);
    -webkit-transform: rotate(-2deg) scale(1.06);
}
.bi03Details{
    position: relative;
}
.bi03Details .bi01Meta{
    color: #7f8495;
    margin: 0;
}
.bi03Details .bi01Meta a:hover{
    color: #9ebbbd;
}
.bi03Details .bi01Meta span i{
    color: #9ebbbd;
}
.blogItem03 h3{
    font-size: 21px;
    line-height: 30px;
    margin: 0;
}
.blogItem03 h3 a{
    color: inherit;
}
.blogItem03 h3 a:hover{
    color: #9ebbbd;
}



/*-----------------------------------------
/  13. Footer
/-----------------------------------------*/
.footer{
    position: relative;
    padding: 90px 0 0;
    background: #4a5556;
}
.footerMode2{
    background: #ebf3f2;
    padding: 79px 0 0;
}
.footer .widget{
    position: relative;
    margin: 0;
    padding: 0;
}
.footer .widget.aboutWidget{
    padding: 0 104px 0 0;
}
.footer .widget.aboutWidget2{
    padding: 0 100px 0 0;
}
.footerLogo{
    position: relative;
    margin: 0 0 28px;
}
.footerLogo2{
    position: relative;
    margin: 0 0 34px;
}
.footerLogo img{
    height: 48px;
    display: inline-block;
    width: auto;
}
.footerLogo2 img{
    height: 42px;
    width: auto;
    display: inline-block;
}
.aboutWidContent{
    color: #bbbdc4;
    margin: 0 0 29px;
}
.footerMode2 .aboutWidContent{
    color: #7f8495;
}
.subscribForm{
    position: relative;
    margin: 0;
}
.subscribForm form{
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
}
.subscribForm form input[type="email"]{
    display: block;
    width: 100%;
    height: 54px;
    background: #FFF;
    border-radius: 5px;
    padding: 0 18px;
    margin: 0;
    font-size: 16px;
    color: #aeb3c3;
    border: none;
}
.subscribForm form input::-moz-placeholder{
    color: #aeb3c3;
    opacity: 1;
}
.subscribForm form input::-ms-input-placeholder{
    color: #aeb3c3;
    opacity: 1;
}
.subscribForm form input::-webkit-input-placeholder{
    color: #aeb3c3;
    opacity: 1;
}
.subscribForm form button{
    position: absolute;
    right: 17px;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 0;
    font-size: 16px;
    color: #7f8495;
    background: transparent;
    line-height: 1;
    top: 19px;
}
.subscribForm form button:hover{
    color: #52586d;
}
.footer .widget .widgetTitle{
    font-size: 24px;
    line-height: 1;
    color: #FFF;
    margin: 17px 0 35px;
}
.footerMode2 .widget .widgetTitle{
    color: #52586d;
}
.addressContent{
    position: relative;
    padding: 0 95px 0 0;
}
.singleAddress{
    position: relative;
    padding: 0 0 0 31px;
    font-size: 16px;
    line-height: 24px;
    color: #bbbdc4;
    margin: 0 0 16px;
}
.footerMode2 .singleAddress{
    color: #7f8495;
}
.addressContent .singleAddress:last-of-type{
    margin: 0;
}
.singleAddress i{
    font-size: 16px;
    line-height: 1;
    position: absolute;
    left: 0;
    top: 5px;
}
.singleAddress a{
    color: inherit;
}
.singleAddress a:hover{
    color: #FFF;
}
.footer .widget ul{
    margin: 0;
    padding: 0;
}
.footer .widget ul li{
    list-style: none;
    margin: 0 0 12px;
}
.footer .widget ul li a{
    color: #bbbdc4;
    display: inline-block;
    padding: 0;
}
.footerMode2 .widget ul li a{
    color: #7f8495;
}
.footer .widget ul li a:hover{
    color: #FFF;
    padding-left: 5px;
}
.footerMode2 .widget ul li a:hover{
    color: #9ebbbd;
}
.footer .widget.twoColMenu ul{
    display: inline-block;
    width: 100%;
}
.footer .widget.twoColMenu li{
    float: left;
    width: 50%;
}
.footerSocial{
    position: relative;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.footerSocial a{
    width: 42px;
    height: 42px;
    font-size: 16px;
    color: #4a5556;
    line-height: 42px;
    text-align: center;
    background: #FFF;
    border-radius: 50%;
    margin-right: 12px;
}
.footerMode2 .footerSocial a{
    background: #4a5556;
    color: #FFF;
}
.footerSocial a:hover, .footerMode2 .footerSocial a:hover{
    background: #9ebbbd;
    color: #FFF;
}
.footerSocial a:last-child{
    margin-right: 0;
}
.footerPayments{
    position: relative;
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    color: #FFF;
    font-size: 36px;
    line-height: 42px;
}
.footerMode2 .footerPayments{
    color: #4a5556;
    line-height: 1;
    padding-top: 1px;
}
.footerPayments a{
    color: inherit;
    margin-left: 12px;
}
.footerPayments a:first-child{
    margin-left: 0;
}
.footerPayments a:hover{
    color: #9ebbbd;
}
.footerMode2 .footerPayments a:hover{
    color: #9ebbbd;
}
.footerAccessRow{
    padding: 70px 0 36px;
}
.footerMode2 .footerAccessRow{
    padding: 83px 0 33px;
}
.footerAccessRow .anSupport{
    margin: 0;
}
.footerAccessRow .anSupport h3:last-of-type{
    font-size: 18px;
}
.footerBar{
    height: 1px;
    width: 100%;
    position: relative;
    background: rgba(255, 255, 255, .12);
}
.footerMode2 .footerBar{
    background: rgba(158, 187, 189, .48);
}
.siteInfoSection{
    background: #4a5556;
}
.sisMode2{
    background: #ebf3f2;
}
.siteInfo{
    color: #bbbdc4;
    padding: 31px 0 46px;
}
.sisMode2 .siteInfo{
    color: #7f8495;
}
.siteInfo a{
    color: inherit;
    font-weight: 700;
}
.siteInfo a:hover{
    color: #FFF;
}
.sisMode2 .siteInfo a:hover{
    color: #9ebbbd;
}
.footerNav{
    display: flex;
    justify-content: flex-end;
    position: relative;
    padding: 31px 0 46px;
}
.footerNav ul{
    margin: 0;
    padding: 0;
    display: inline-flex;
    justify-content: flex-end;
}
.footerNav ul li{
    list-style: none;
    margin-right: 42px;
}
.footerNav ul li:last-child{
    margin-right: 0;
}
.footerNav ul li a{
    display: block;
    color: #bbbdc4;
}
.sisMode2 .footerNav ul li a{
    color: #7f8495;
}
.footerNav ul li a:hover{
    color: #FFF;
}
.sisMode2 .footerNav ul li a:hover{
    color: #9ebbbd;
}
#backtotop{
    position: fixed;
    letter-spacing: 0;
    right: 25px;
    bottom: -25px;
    width: 45px;
    height: 45px;
    background: #9ebbbd;
    color: #fff;
    font-size: 14px;
    text-align: center;
    line-height: 45px;
    padding: 0;
    opacity: 0;
    visibility: hidden;
    z-index: 999;
    border-radius: 0;
    border-radius: 50%;
}
#backtotop:hover{
    background: #52586d;
}



/*
 Theme Name: Ulina
 Theme URI: https://uiuxom.com/ulina/html/
 Author: uiuxom
 Author URI: https://themeforest.net/user/uiuxom
 Description: Ulina - Fashion Ecommerce Responsive HTML Template
 Version: 1.0
 License:
 License URI: 
*/

/*==================================
    [Table of contents]
===================================
    01. max-width: 1699px
    02. min-width: 1366px & max-width: 1499px
    03. min-width: 1366px & max-width: 1399px
    04. min-width: 1200px & max-width: 1399px
    05. max-width: 1365px
    06. min-width: 1200px & max-width: 1365px
    07. min-width: 992px & max-width: 1199px
    08. max-width: 1199px
    09. min-width: 768px & max-width: 991px
    10. max-width: 991px
    11. max-width: 767px
    12. max-width: 575px
    13. min-width: 320px & max-width: 410px
    14. min-width: 320px & max-width: 355px
*/



/*----------------========----------------
/  01. max-width: 1699px
/----------------========----------------*/
@media (max-width: 1699px){
    /* Header */
    .anSocial a.tog{
        display: inline-block;
    }
    .ansWrap{
        position: absolute;
        width: auto;
        right: calc(100% + 15px);
        top: 50%;
        background: #FFF;
        box-shadow: 0 0 50px 0 rgb(29 35 58 / 8%);
        border-radius: 10px;
        text-align: center;
        z-index: -1;
        opacity: 0;
        visibility: hidden;
        padding: 25px;
        display: inline-flex;

        -webkit-transform: rotateX(-75deg) translateY(-50%);
        -moz-transform: rotateX(-75deg) translateY(-50%);
        transform: rotateX(-75deg) translateY(-50%);
        transform-origin: 0% 0%;
        -webkit-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-style: preserve-3d;
        -webkit-transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
        -o-transform-style: preserve-3d;
        -webkit-transition: .4s;
        transition: .4s;
    }
    .anSocial.active .ansWrap{
        pointer-events: inherit;
        visibility: visible;
        opacity: 1;
        z-index: 91;
        -webkit-transform: rotatex(0deg) translateY(-50%);
        -moz-transform: rotatex(0deg) translateY(-50%);
        transform: rotatex(0deg) translateY(-50%);
    }
    .ansWrap a{
        display: inline-block;
    }
}



/*----------------========----------------
/  02. min-width: 1366px & max-width: 1499px
/----------------========----------------*/
@media (min-width: 1366px) and (max-width: 1499px){
    /* Header */
    .header01{
        padding: 0 28px;
    }
    .logo {
        min-width: 15%;
    }
    .mainMenu > ul > li {
        margin: 0 35px 0 0;
    }
    .anSupport{
        margin-left: 35px;
        padding-left: 50px;
    }
    .anItems{
        padding: 0 0 0 19px;
    }
    .anSelects{
        padding: 0 0 0 19px;
        margin-right: 20px;
    }
    .anSocial{
        margin-right: 20px;
    }
    /* Home 01  */
    .lbContent{
        padding-left: 30px;
    }
    .lookBook01.lb01M0:after {
        width: 240px;
        height: 240px;
        right: -28px;
    }
    .lb01M1 .lbContent{
        padding-left: 25px;
        padding-right: 25px;
    }
    .lb01M2:after {
        bottom: auto;
        width: 240px;
        height: 240px;
    }
    .lb01M3:after{
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    .lb01M4:after{
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    .lookBook01.lb01M5 img{
        max-width: 60%;
        height: auto;
        margin: 0 0 21px;
    }
    .lb01M4 .lbContent{
        padding-left: 35px;
        padding-right: 35px;
    }
    .blogItem02{
        padding-left: 25px;
        padding-right: 25px;
    }
    .blogItem02 .bi01Meta span{
        margin-right: 10px;
    }
    .blogItem02 .bi01Meta span:last-child{
        margin-right: 0;
    }
    .blogItem02 .bi01Meta span i{
        margin-right: 4px;
    }
    .blogItem02 .ulinaLink{
        left: 25px;
    }
    /* Home 2 */
    .lb01M7 .lbContent {
        padding: 48px 0 0 24px;
    }
    .lb01M9 .lbContent {
        padding: 48px 24px 0 0;
    }
    .lb01M8 .lbContent{
        padding-right: 24px;
    }
    .lb01M10 .lbContent {
        max-width: 70%;
        padding: 48px 0 0 24px;
    }
    .lb01M10 .discountLabel {
        right: 30px;
        bottom: 30px;
    }
    .lb01M11 .ulinaCountDown .countdown-row span{
        width: auto;
        margin-right: 18px;
    }
    .lb01M11 .ulinaCountDown .countdown-row span span:first-child{
        position: relative;
        display: block;
        height: 48px;
        width: 48px;
        background: #FFF;
        font-size: 21px;
        color: #52586d;
        line-height: 48px;
        text-align: center;
        font-weight: 400;
        border-radius: 50%;
        margin: 0 0 6px;
    }
    .lb01M11 .ulinaCountDown .countdown-row span span:first-child:after{
        right: -13px;
        top: 12px;
    }

    /* Shop Pages */
    .pi02Desc{
        display: none;
    }
    .productGalleryWrap2{
        padding: 0;
    }
    .checkoutForm{
        padding-right: 30px;
    }
    .shippingCoupons, .orderReviewWrap{
        padding-left: 30px;
    }
}



/*----------------========----------------
/  03. min-width: 1366px & max-width: 1399px
/----------------========----------------*/
@media (min-width: 1366px) and (max-width: 1399px){
    /* TestimonialPage */
    .testimonialItem01{
        padding: 55px 40px 60px 40px;
    }
    /* 404 */
    .fofContent::after{
        left: 190px;
    }

    /*Shop Pages*/
    .productGalleryWrap{
        padding-right: 0;
    }
    .productGalleryWrap2{
        padding: 0;
    }
    .productGalleryThumb2{
        width: 110px;
    }
    /* Footer */
    .footer .widget.aboutWidget {
        padding: 0 50px 0 0;
    }
    .addressContent{
        padding: 0 50px 0 0;
    }
    /* sidebar widget */
    .sidebar .widget {
        padding: 43px 30px 48px;
    }
    .galleryWidget a {
        width: 88px;
    }
    /* About Page */
    .aiImgRow .aiImg01 {
        margin: 50px 15px 0 0;
    }
    .aiImgRow img{
        max-width: 48%;
    }
    .aiImgRow img.aiImg04{
        max-width: 63%;
    }
}


/*----------------========----------------
/  04. min-width: 1200px & max-width: 1399px
/----------------========----------------*/
@media (min-width: 1200px) and (max-width: 1399px){
    /* About Page */
    .aiImgRow .aiImg01 {
        margin: 50px 15px 0 0;
    }
    .aiImgRow img{
        max-width: 48%;
    }
    .aiImgRow img.aiImg04{
        max-width: 63%;
    }
    .aboutContent {
        padding: 0 0 0 30px;
    }
    
}


/*----------------========----------------
/  05. max-width: 1365px
/----------------========----------------*/
@media (max-width: 1365px){
    .hideOnMobile{
        display: none;
    }

    /*Shop Pages*/
    .productGalleryWrap{
        padding-right: 0;
    }
    .productGalleryWrap2{
        padding: 0;
    }
    .productGalleryThumb2{
        width: 110px;
    }
    /* About Page */
    .abps02Con {
        padding: 0;
    }
}


/*----------------========----------------
/  06. min-width: 1200px & max-width: 1365px
/----------------========----------------*/
@media (min-width: 1200px) and (max-width: 1365px){
    /* Home 01  */
    .lbContent{
        padding-left: 30px;
    }
    .lookBook01.lb01M0:after {
        width: 240px;
        height: 240px;
        right: -28px;
    }
    .lb01M1 .lbContent{
        padding-left: 25px;
        padding-right: 25px;
    }
    .lb01M2:after {
        bottom: auto;
        width: 240px;
        height: 240px;
    }
    .lb01M3:after{
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    .lb01M4:after{
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    .lookBook01.lb01M5 img{
        max-width: 60%;
        height: auto;
        margin: 0 0 21px;
    }
    .lb01M4 .lbContent{
        padding-left: 35px;
        padding-right: 35px;
    }
    .blogItem02{
        padding-left: 25px;
        padding-right: 25px;
    }
    .blogItem02 .bi01Meta span{
        margin-right: 10px;
    }
    .blogItem02 .bi01Meta span:last-child{
        margin-right: 0;
    }
    .blogItem02 .bi01Meta span i{
        margin-right: 4px;
    }
    .blogItem02 .ulinaLink{
        left: 25px;
    }

    /* Home 2 */
    .lb01M7 .lbContent {
        padding: 48px 0 0 24px;
    }
    .lb01M9 .lbContent {
        padding: 48px 24px 0 0;
    }
    .lb01M8 .lbContent{
        padding-right: 24px;
    }
    .lb01M10 .lbContent {
        max-width: 70%;
        padding: 48px 0 0 24px;
    }
    .lb01M10 .discountLabel {
        right: 30px;
        bottom: 30px;
    }
    .lb01M11 .ulinaCountDown .countdown-row span{
        width: auto;
        margin-right: 18px;
    }
    .lb01M11 .ulinaCountDown .countdown-row span span:first-child{
        position: relative;
        display: block;
        height: 48px;
        width: 48px;
        background: #FFF;
        font-size: 21px;
        color: #52586d;
        line-height: 48px;
        text-align: center;
        font-weight: 400;
        border-radius: 50%;
        margin: 0 0 6px;
    }
    .lb01M11 .ulinaCountDown .countdown-row span span:first-child:after{
        right: -13px;
        top: 12px;
    }

    /* Footer Section */
    .footer .widget.aboutWidget{
        padding: 0 80px 0 0;
    }
    .addressContent{
        padding: 0 60px 0 0;
    }
    /* TestimonialPage */
    .testimonialItem01{
        padding: 55px 40px 60px 40px;
    }
    /* 404 */
    .fofContent::after{
        left: 186px;
    }

    /* Shop Pages */
    .pi02Desc{
        display: none;
    }
    .cart_totals{
        margin-left: 0;
    }
    .checkoutForm{
        padding-right: 30px;
    }
    .shippingCoupons, .orderReviewWrap{
        padding-left: 30px;
    }
    /* Footer */
    .footer .widget.aboutWidget2{
        padding: 0 40px 0 0;
    }
    /* sidebar widget */
    .sidebar .widget {
        padding: 43px 30px 48px;
    }
    .galleryWidget a {
        width: 88px;
    }
    /* About Page */
    .aiImgRow .aiImg01 {
        margin: 50px 15px 0 0;
    }
    .aiImgRow img{
        max-width: 48%;
    }
    .aiImgRow img.aiImg04{
        max-width: 63%;
    }
}


/*----------------========----------------
/  07. min-width: 992px & max-width: 1199px
/----------------========----------------*/
@media (min-width: 992px) and (max-width: 1199px){
    /* TestimonialPage */
    .testimonialItem01{
        padding: 40px 30px 40px 30px;
    }
    .ti01Content {
        font-size: 16px;
        line-height: 28px;
    }

    /* Home Page */
    .dealProductImage {
        padding: 0px 0 0 0;
        margin: 65px 0 0 0;
    }
    .dealProductImage:after{
        left: auto;
        right: 0;
    }
    .dealProductImage img{
        max-width: 100%;
    }
    .lb01M6 .lbContent{
        padding: 0 0 0 30px;
        top: 50%;
        transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
    }

    .blogItem01{
        margin: 0 0 24px;
    }
    .testimonialSliderWrap {
        padding: 50px 24px 50px 100px;
        margin: 0 -24px 0 0;
    }
    .blogItem02{
        min-height: 252px;
    }

    /* Home 2 */
    .ctaContent{
        padding-top: 70px;
    }

    /*Shop Pages*/
    .productGalleryWrap2{
        padding: 0;
    }
    .productGalleryThumb2{
        width: 90px;
    }
    .productGallery2 {
        width: calc(100% - 108px);
        float: left;
    }
    
    /* sidebar widget */
    .sidebar .widget {
        padding: 43px 30px 48px;
    }
    /* Blog Details */
    .postNavigationItem {
        padding: 9px 0 0 0;
    }
    .postNavigationItem img {
        width: 70px;
        height: 70px;
        position: relative;
    }
    .postNavigationItem h4 {
        margin: 12px 0 6px;
    }
    .postNavigationItem.pniRight{
        padding-right: 0;
    }
    .postAuthorBox h3 {
        margin: 7px 0 20px;
    }
    .pabSocial {
        position: relative;
        right: auto;
        top: auto;
        justify-content: flex-start;
        margin: 0 0 25px 0;
    }
    .pabSocial a{
        margin: 0 8px 0 0;
    }
    .pabSocial a:last-child{
        margin: 0 0 0 8px;
    }
    .comment-reply {
        height: 36px;
        padding: 0 24px;
        font-size: 14px;
        line-height: 36px;
    }
    .postTags a {
        height: 36px;
        font-size: 14px;
        line-height: 36px;
        padding: 0 14px;
    }
    .postShare.bi04Share {
        padding: 0 12px 0 0;
    }
    /* About Page */
    .singleCounter02 {
        justify-content: center;
        padding: 0;
    }
}


/*----------------========----------------
/  08. max-width: 1199px
/----------------========----------------*/
@media (max-width: 1199px){
    /* Header Section */
    .header01 {
        padding: 0 18px;
    }
    .logo{
        width: 20%;
    }
    .anSupport{
        margin-left: 35px;
        padding-left: 50px;
    }
    .anItems{
        padding: 0 0 0 19px;
    }
    .anSelects{
        padding: 0 0 0 19px;
        margin-right: 20px;
    }
    .anSocial{
        margin-right: 20px;
    }

    /* Slider Section */
    .tp-caption.theSubTitle{
        padding-left: 21px !important;
    }
    .tp-caption.theTitles{
        padding-left: 30px !important;
    }
    .tp-caption.theBTNS{
        margin-left: 30px !important;
    }

    /* Home Page */
    .featureSection .iconBox01{
        margin: 0 0 45px;
    }
    .featureSection{
        padding-bottom: 65px;
    }
    .dealProductContent p{
        padding-right: 0;
    }

    /* Footer Section */
    .footer .widget.aboutWidget{
        padding: 0 15px 0 0;
    }
    .addressContent{
        padding: 0 15px 0 0;
    }
    /* 404 */
    .fofContent::after{
        left: 100px;
    }

    /* Home 02 */
    .lb01M7 .lbContent, .lb01M10 .lbContent{
        padding-left: 24px;
    }
    .lb01M8 .lbContent, .lb01M9 .lbContent{
        padding-right: 24px;
    }
    .lb01M11{
        padding-left: 24px;
        padding-right: 24px;
    }
    .lb01M7 .lbContent h2, .lb01M8 .lbContent h2, .lb01M11 .lbContent h2, .lb01M9 .lbContent h2, .lb01M10 .lbContent h2{
        font-size: 24px;
        line-height: 34px;
    }
    .lb01M11 .lbContent h2{
        margin: 0 0 12px;
    }
    .lb01M11 .pi01Price{
        font-size: 22px;
        margin: 0 0 10px;
    }
    .lb01M11 .pi01Price del{
        font-size: 14px;
    }
    .lb01M11 .pi01Price del:after{
        top: 6px;
    }
    .lb01M11 .ulinaCountDown .countdown-row span{
        width: auto;
        margin-right: 10px;
    }
    .lb01M11 .ulinaCountDown .countdown-row span span:first-child{
        position: relative;
        display: block;
        height: 48px;
        width: 48px;
        background: #FFF;
        font-size: 21px;
        color: #52586d;
        line-height: 48px;
        text-align: center;
        font-weight: 400;
        border-radius: 50%;
        margin: 0 0 6px;
    }
    .lb01M11 .ulinaCountDown .countdown-row span span:first-child:after{
        display: none;
    }
    .lb01M10 .discountLabel{
        right: 24px;
        bottom: 24px;
    }
    .featureSection2 .iconBox01{
        margin: 0 0 45px;
    }
    .featureSection2{
        padding-bottom: 25px;
    }
    .ctaContent{
        padding: 32px 0 70px;
    }
    .ctaImageWrap{
        padding: 0;
        text-align: left;
    }

    /* Shop Pages */
    .collectionsSections .productItem01{
        margin: 0 0 45px;
    }
    .collectionProductRow{
        margin-bottom: 16px;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-price,
    .woocommerce .shop_table.cart_table tbody tr td.product-quantity,
    .woocommerce .shop_table.cart_table tbody tr td.product-subtotal,
    .woocommerce .shop_table.cart_table tbody tr td.product-remove{
        width: auto;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-price{
        padding-right: 45px;
    }
    .calculatShippingForm{
        padding-right: 0;
    }
    .cartCoupon{
        padding: 0;
    }
    .cart_totals{
        margin-left: 0;
    }
    .woocommerce .shop_table.cart_table.wisthlist_table thead tr th.product-price,
    .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-price,
    .woocommerce .shop_table.cart_table.wisthlist_table thead tr th.product-availability,
    .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-availability,
    .woocommerce .shop_table.cart_table.wisthlist_table thead tr th.product-addtocart,
    .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-addtocart{
        width: auto;
        padding-right: 25px;
        text-align: left;
    }
    .woocommerce .shop_table.cart_table.wisthlist_table thead tr th.product-remove, .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-remove{
        width: auto;
    }
    
    .checkoutForm{
        padding-right: 0;
    }
    .shippingCoupons, .orderReviewWrap{
        padding-left: 0;
    }
    .checkoutForm{
        margin-bottom: 50px;
    }
    /* Footer */
    .footer .widget.aboutWidget2{
        padding: 0;
    }
    /* About Page */
    .aiImgRow img.aiImg02 {
        float: none !important;
    }
    .aiImgRow img.aiImg04 {
        float: none !important;
    }
    .aboutContent {
        padding: 50px 0 0;
    }
}


/*----------------========----------------
/  09. min-width: 768px & max-width: 991px
/----------------========----------------*/
@media (min-width: 768px) and (max-width: 991px){
    /* TestimonialPage */
    .testimonialItem01{
        padding: 50px 40px 50px 40px;
    }

    /*Shop Pages*/
    .productGalleryWrap{
        max-width: 588px;
        margin: 0 0 50px;
    }
    .woocommerce .shop_table.cart_table tfoot tr td .ulinaBTN2{
        padding: 0 25px;
    }
    .woocommerce .shop_table.cart_table thead tr th.product-price,
    .woocommerce .shop_table.cart_table tbody tr td.product-price,
    .woocommerce .shop_table.cart_table thead tr th.product-quantity,
    .woocommerce .shop_table.cart_table tbody tr td.product-quantity,
    .woocommerce .shop_table.cart_table thead tr th.product-subtotal,
    .woocommerce .shop_table.cart_table tbody tr td.product-subtotal{
        padding-left: 15px;
        padding-right: 15px;
    }
    .woocommerce .shop_table.cart_table.wisthlist_table thead tr th.product-price,
    .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-price,
    .woocommerce .shop_table.cart_table.wisthlist_table thead tr th.product-availability,
    .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-availability,
    .woocommerce .shop_table.cart_table.wisthlist_table thead tr th.product-addtocart,
    .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-addtocart{
        padding-right: 15px;
    }
}


/*----------------========----------------
/  10. max-width: 991px
/----------------========----------------*/
@media (max-width: 991px){
    /* Header Section */
    .anSupport{
        display: none;
    }
    .logo {
        width: 30%;
    }
    .cartWidgetArea{
        right: 0;
    }
    /* Home Page */
    .personImage img{
        max-width: 100%;
        height: auto;
    }
    .shapeImage img{
        max-width: 100%;
        height: auto;
    }
    .lbContent{
        padding-left: 30px;
        z-index: 3;
    }
    .lookBook01.lb01M0:after {
        width: 240px;
        height: 240px;
        right: -28px;
    }
    .lb01M1 .lbContent{
        padding-left: 25px;
        padding-right: 25px;
    }
    .lb01M2:after {
        bottom: auto;
        width: 240px;
        height: 240px;
    }
    .lb01M3:after{
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    .lb01M4:after{
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    .lookBook01.lb01M5 img{
        max-width: 60%;
        height: auto;
        margin: 0 0 21px;
    }
    .lb01M4 .lbContent{
        padding-left: 35px;
        padding-right: 35px;
    }
    .lbContent h2 {
        font-size: 31px;
        line-height: 43px;
    }
    .lb01M6 .lbContent{
        max-width: 45%;
    }
    .lb01M6 .lbContent h2 {
        font-size: 36px;
        line-height: 48px;
    }
    .dealProductContent {
        padding: 75px 0 75px;
        text-align: center;
    }
    .dpcPriceWrap{
        justify-content: center;
    }
    .dealProductImage {
        text-align: center;
        padding: 0 0 75px;
        margin: 0;
    }
    .dealProductImage:after{
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    .testimonialSliderWrap {
        padding: 50px 0 50px 0;
        margin: 0 0px 0 0;
    }
    .blogItem01{
        margin: 0 0 24px;
    }
    .blogSection2 .blogItem03{
        margin: 0 0 30px;
    }

    /* Contact Section */
    form.contactForm{
        margin: 52px 0 0;
    }
    /* Footer Section */
    .footer .widget{
        margin: 0 0 40px;
    }
    .footerAccessRow{
        padding: 30px 0 36px;
    }
    .footerNav ul li{
        margin-right: 25px;
    }
    .footer .widget.aboutWidget2{
        padding-right: 0;
    }
    .footerAccessRow .anSupport{
        display: block;
    }
    /* 404 */
    .fofContent::after{
        left: 0;
    }

    /* Shop Pages */
    .shopPageHasSidebar .col-lg-4.col-xl-3{
        order: 2;
    }
    .shopPageHasSidebar .col-lg-8.col-xl-9{
        order: 1;
    }
    .shopSidebar{
        margin: 80px 0 0;
    }
    .descriptionContent.featureCols{
        padding-top: 15px;
    }
    .reviewList{
        margin: 0 0 46px;
    }
    .productGalleryWrap2{
        max-width: 581px;
        margin: 0 0 52px;
    }
    .productGalleryThumb2 {
        width: 120px;
    }
    .cart_totals{
        margin-top: 50px;
    }
    .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-addtocart a.ulinaBTN{
        height: 35px;
        font-size: 12px;
        line-height: 37px;
        border-radius: 35px;
        display: inline-block;
        min-width: 110px;
        padding: 0 10px;
    }
    
    /* Blog Standard */
    .blogPageSection .col-xl-8.col-lg-7 {
        order: 1;
    }
    .blogPageSection .col-xl-4.col-lg-5{
        order: 2;
    }
    .blogDetailsPageSection .col-xl-8.col-lg-7 {
        order: 1;
    }
    .blogDetailsPageSection .col-xl-4.col-lg-5{
        order: 2;
    }
    /* sidebar */
    .sidebar {
        margin: 50px 0 0;
    }
    /* galleryWidget */
    .galleryWidget a:nth-child(3), 
    .galleryWidget a:nth-child(6), 
    .galleryWidget a:nth-child(9), 
    .galleryWidget a:nth-child(12){
        margin: 0 12px 12px 0;
    }
     /* About Page */
    .singleCounter02 {
        justify-content: center;
        padding: 0;
    }
    .singleCounter02 h2 {
        font-size: 48px;
        line-height: 1;
        margin: 0 15px 0 0;
    }
    .singleCounter02 h3 {
        font-size: 18px;
        line-height: 24px;
    }
    .abps02Con {
        padding: 0 130px 0 0;
    }
    
    /* Quick View */
    .productQuickView .modal-lg{
        max-width: 588px;
    }
    .productQuickView .productGalleryWrap{
        border-radius: 20px 20px 0 0;
    }
    .productQuickView .productContent{
        padding-left: 24px;
    }
}


/*----------------========----------------
/  11. max-width: 767px
/----------------========----------------*/
@media (max-width: 767px){
    /* Header Section */
    .header01{
        padding: 0 12px;
    }
    .anSelects{
        display: none;
    }
    .tp-caption.theSubTitle {
        padding: 0 !important;
    }
    .tp-caption.theTitles {
        padding-left: 0 !important;
    }
    .tp-caption.theBTNS {
        margin-left: 0 !important;
    }
    .personImage img{
        display: inline-block !important;
        width: 100% !important;
        height: auto !important;
    }

    /* Home Page Section */
    .productTabs ul.productTabsNav.absolutes{
        position: relative;
        top: 0;
        right: auto;
        justify-content: flex-start;
        margin: 0 0 50px;
    }
    .lb01M6 .lbContent {
        max-width: 60%;
        padding: 0 0 0 24px;
        top: 50%;
        transform: translateY(-50%);
    }

    /* FAQ Section */
    .ulinaFAQTab {
        display: block;
        margin: 0 0 39px;
        text-align: left;
    }
    .ulinaFAQTab li {
        display: inline-block;
        margin: 0 5px 6px 0;
    }
    /* Footer Section */
    .footerSocial{
        justify-content: center;
        margin: 0 0 21px;
    }
    .footerPayments{
        justify-content: center;
    }
    .siteInfo{
        text-align: center;
        padding: 31px 0 13px;
    }
    .footerNav{
        justify-content: center;
        padding: 0 0 46px;
    }
    .cpProduct{
        top: calc(100% + 15px);
        transform: translateY(0) translateX(-50%);
        left: 50%;
    }
    .blogSection2 .pdt34{
        padding: 0 0 52px 12px;
        text-align: left !important;
    }
    .instagramGrid .instagramPhoto{
        width: 50%;
    }
    .footerMode2 .footerSocial{
        justify-content: flex-start;
    }
    .tbAccessNav .anSocial{
        margin-right: 0;
    }

    /* Shop Pages */
    .pageBannerContent h2 {
        font-size: 52px;
        line-height: 64px;
    }
    .singleBlogPageBanner .pageBannerContent h2{
        font-size: 50px;
        line-height: 62px;
    }
    .filterNav{
        display: none;
    }
    .collectionRow .pdt34{
        padding-top: 0;
        padding-bottom: 52px;
        text-align: left !important;
    }
    .productGalleryWrap{
        margin: 0 0 50px;
    }
    .productContent{
        padding-left: 0;
    }
    .woocommerce .shop_table.cart_table{
        display: block;
    }
    .woocommerce .shop_table.cart_table thead{
        display: none;
    }
    .woocommerce .shop_table.cart_table tbody{
        display: block;
    }
    .woocommerce .shop_table.cart_table tbody tr{
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        align-items: flex-start;
        width: 100%;
        border-top: 1px solid #dbdfe3;
        padding: 24px 0 24px 85px;
        position: relative;
        min-height: 130px;
    }
    .woocommerce .shop_table.cart_table tbody tr:first-child{
        border-top: none;
    }
    .woocommerce .shop_table.cart_table tbody tr td{
        display: inline-flex !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        border: none !important;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-thumbnail{
        position: absolute;
        left: 0;
        top: 24px;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-thumbnail img {
        width: 70px;
        height: 82px;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-name{
        width: 100%;
        padding: 0;
        margin: 0 0 14px;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-name a{
        line-height: 26px;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-price{
        padding-right: 25px;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-quantity{
        padding-right: 25px;
    }
    .quantity {
        height: 35px;
        width: 90px;
        border-radius: 35px;
    }
    .quantity button {
        left: 10px;
        top: 1px;
    }
    .quantity button:last-child {
        right: 10px;
        top: 8px;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-remove{
        position: absolute;
        right: 0;
        top: 24px;
    }
    .woocommerce .shop_table.cart_table tbody tr td a.remove{
        width: 25px;
        height: 25px;
    }
    .woocommerce .shop_table.cart_table tbody tr td a.remove span{
        width: 11px;
        height: 11px;
    }
    .woocommerce .shop_table.cart_table tfoot tr{
        display: flex;
        align-items: flex-start;
        justify-content: flex-start;
        flex-wrap: wrap;
        padding: 24px 0 0;
        border-top: 1px solid #dbdfe3;
    }
    .woocommerce .shop_table.cart_table tfoot tr td{
        display: inline-flex;
        justify-content: flex-start;
        padding: 0;
        border: none;
    }
    .woocommerce .shop_table.cart_table tfoot tr td:first-child{
        padding-bottom: 12px;
    }
    .calculatShippingForm{
        margin: 0 0 50px;
    }
    .woocommerce .shop_table.cart_table.wisthlist_table thead tr th.product-price,
    .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-price,
    .woocommerce .shop_table.cart_table.wisthlist_table thead tr th.product-availability,
    .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-availability,
    .woocommerce .shop_table.cart_table.wisthlist_table thead tr th.product-addtocart,
    .woocommerce .shop_table.cart_table.wisthlist_table tbody tr td.product-addtocart{
        padding-right: 15px;
        padding-left: 0;
    }
    
    /* Blog Details */
    .postShare.bi04Share {
        justify-content: flex-start;
        padding: 0;
        margin: 19px 0 0;
    }
    .postNavigationItem.pniRight {
        margin: 24px 0 0;
    }
    .postAuthorBox {
        padding: 41px 41px 35px 177px;
    }
    .postAuthorBox img {
        width: 100px;
        height: 100px;
    }
    .postAuthorBox h3 {
        margin: 7px 0 20px;
    }
    .pabSocial {
        position: relative;
        right: auto;
        top: auto;
        justify-content: flex-start;
        margin: 0 0 24px 0;
    }
    .pabSocial a{
        margin: 0 8px 0 0;
    }
    .pabSocial a:last-child{
        margin: 0 0 0 8px;
    }
    .singleComment {
        padding: 39px 0 0 108px;;
    }
    .singleComment > img {
        width: 76px;
        height: 76px;
    }
    .comment-reply {
        height: 36px;
        padding: 0 24px;
        font-size: 14px;
        line-height: 36px;
    }
    /* About Page */
    .abps02Con {
        padding: 0;
    }
    .counterArea {
        margin: 0 0 -182px;
        padding: 55px 0;
    }
    .singleCounter02 {
        margin: 0 0 30px;
    }
    .aboutPageSection02 {
        padding: 300px 0 114px;
    }
    .aiImgRow .aiImg01 {
        margin: 50px 10px 0 0;
    }
    .aiImgRow img {
        max-width: 48%;
    }
    .aiImgRow img.aiImg03{
        max-width: 30%;
    }
    .aiImgRow img.aiImg04{
        max-width: 63%;
    }
    .iconBox02.ib_Last{
        margin: 35px 0 0;
    }

    /* Footer */
    .footerMode2 .row.footerAccessRow .col-md-6 {
        text-align: center;
    }
    .footerAccessRow .anSupport {
        display: inline-block;
        text-align: left;
        margin: 0 0 21px;
    }
    /* Quick View */
    .productQuickView .modal-lg{
        max-width: inherit;
    }
}


/*----------------========----------------
/  12. max-width: 575px
/----------------========----------------*/
@media (max-width: 575px){
    /* 404 */
    .fofContent::after{
        left: 0;
        right: 0;
        margin: 0 auto;
        width: 300px;
        height: 300px;
    }

    /*Home Page*/
    .anSocial{
        display: none;
    }
    .anItems{
        padding-left: 0;
    }
    .anItems:before{
        display: none;
    }
    .dealProductImage:after{
        width: 280px;
        height: 280px;
    }
    .logo img {
        height: 38px;
        width: auto;
    }
    .anItems > div.anSearch{
        display: none;
    }
    .cartWidgetArea{
        width: 290px;
        padding: 25px 15px;
        right: -10px;
    }
    .cartWidgetProduct{
        padding-right: 11px;
    }
    .productCarousel.owl-carousel .owl-nav {
        position: relative;
        right: auto;
        top: auto;
        padding: 52px 0 0;
        text-align: center;
    }
    .lookBook01.lb01M0{
        padding: 50px 0 0 0;
    }
    .lb01M3 .lbContent{
        padding: 0 24px 43px;
    }
    .lb01M4 .lbContent{
        padding-left: 24px;
        padding-right: 24px;
    }
    .dpcPriceWrap {
        display: block;
        text-align: center;
    }
    .dpcPriceWrap .pi01Price {
        margin: 0 0 13px;
        justify-content: center;
    }
    .ulinaCountDown .countdown-row span{
        width: auto;
        margin-right: 16px;
    }
    .ulinaCountDown .countdown-row span span:first-child{
        width: 48px;
        height: 48px;
        line-height: 50px;
        font-size: 18px;
    }
    .ulinaCountDown .countdown-row span span:first-child:after{
        right: -11px;
        top: 10px;
    }
    .productTabs ul.productTabsNav.absolutes{
        justify-content: center;
    }
    .productTabs ul.productTabsNav li {
        margin: 0 0 0 20px;
    }
    .lb01M6 .lbContent h2 {
        font-size: 24px;
        line-height: 34px;
    }
    .categoryCarousel.owl-carousel .owl-nav, .categoryCarousel2.owl-carousel .owl-nav {
        position: relative;
        right: auto;
        top: auto;
        text-align: center;
        padding: 50px 0 0;
    }
    .bi01Content {
        bottom: 17px;
        padding: 0 24px;
    }
    .bi01Content h3 {
        font-size: 21px;
        line-height: 30px;
        margin: 12px 0 0;
    }
    .anItems > div.anUser{
        margin-right: 15px;
    }
    .tp-caption.theTitles {
        padding-left: 0 !important;
        font-size: 36px !important;
        line-height: 46px !important;
    }
    .mainMenu ul li ul{
        min-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .popup_search_form input[type="search"]{
        font-size: 18px;
    }
    .search_Closer {
        margin: 0;
        top: -28px;
        position: relative;
        z-index: 99;
    }
    .ctaImageWrap{
        text-align: center;
    }
    .pointerImage{
        width: 296px;
    }
    .clickPoint.cp01 {
        left: 117px;
    }
    .clickPoint.cp03 {
        left: 80px;
        bottom: 110px;
    }
    .clickPoint.cp02 {
        left: 166px;
        top: 93px;
    }
    .cpProduct {
        top: calc(100% + 15px);
        transform: translateY(0) translateX(-50%);
        -moz-transform: translateY(0) translateX(-50%);
        -webkit-transform: translateY(0) translateX(-50%);
        left: 50%;
        width: 146px;
        padding: 21px 12px 18px;
        text-align: center;
        box-shadow: 0 0 50px 0 rgb(29 35 58 / 8%);
    }
    .cpProduct img {
        width: 96px;
        height: 96px;
        position: relative;
        left: 0;
        top: 0;
        border-radius: 5px;
        margin: 0 0 7px;
    }
    .cpProduct .pi01Price{
        justify-content: center;
    }
    .testimonialCarousel2.owl-carousel button.owl-dot{
        margin: 0 6px 0 0;
    }
    .tbInfo {
        line-height: 18px;
        padding: 10px 0px 11px;
        text-align: center;
    }
    
    .singleBlogPageBanner .pageBannerContent h2{
        font-size: 40px;
        line-height: 52px;
    }
    /*Shop Page*/
    .shopAccessBar{
        justify-content: flex-start;
        padding-top: 15px;
    }
    .productViewTabnav{
        margin-left: auto;
    }
    .productItem02{
        display: block;
    }
    .pi02Thumb{
        width: 100%;
    }
    .pi02Thumb img{
        max-width: 100%;
        height: auto;
    }
    .pi02Details{
        width: 100%;
        padding: 25px 0 0;
    }
    .pageBannerContent h2 {
        font-size: 42px;
        line-height: 54px;
    }

    /* Shop Page */
    .postReview{
        padding-left: 0;
    }
    .postReview img {
        position: relative;
        left: 0;
        top: 0;
        margin: 0 0 18px;
    }
    .productDetailsTab {
        display: block;
        text-align: left;
    }
    .productDetailsTab li{
        display: inline-block;
        margin: 0 15px 0 0;
    }
    .productDetailsTab li button{
        padding: 0;
        margin: 0 0 10px 0;
    }
    .productDetailsTab li button:after{
        display: none;
    }
    .pcBtns{
        flex-wrap: wrap;
    }
    .pcBtns .quantity, .pcBtns .ulinaBTN, .pcBtns a{
        margin-bottom: 12px;
    }
    .productGalleryWrap2{
        display: flex;
        flex-wrap: wrap;
    }
    .productGallery2{
        width: 100%;
        order: 1;
        float: none;
        margin: 0 0 18px;
    }
    .productGalleryThumb2{
        order: 2;
        float: none;
        width: 100%;
        margin: 0;
    }
    .pcVariations .col-sm-6{
        margin: 0 0 12px;
    }
    .pcVariations .col-sm-6:last-of-type{
        margin: 0;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-price{
        padding-right: 10px;
    }
    .woocommerce .shop_table.cart_table tbody tr td.product-quantity{
        padding-right: 10px;
    }
    .woocommerce .shop_table.cart_table tbody tr{
        padding-right: 30px;
    }
    
    /* Blog Standard */
    .bi04Footer, .bi04Share{
        display: block;
    }
    .postNavigationRow, 
    .postAuthorBox, 
    .postCommetnListBox, 
    .postCommetnFormBox {
        padding: 24px;
    }
    .postNavigationItem {
        position: relative;
        padding: 0;
    }
    .postNavigationItem.pniRight {
        padding: 0;
        text-align: left;
    }
    .postNavigationItem img {
        position: relative;
        margin: 0 0 12px;
    }
    .postAuthorBox img {
        width: 120px;
        height: 120px;
        position: relative;
        top: 0;
        left: 0;
        margin: 0 0 12px;
    }
    .singleComment {
        padding: 0;
    }
    .singleComment > img {
        position: relative;
        margin: 30px 0 12px;
        top: 0;
    }
    .postCommetnListBox ol > li:first-child .singleComment > img {
        top: 0;
        margin: 0 0 12px;
    }
    .comment-reply {
        top: 54px;
    }
    .postCommetnListBox ol > li:first-child .singleComment .comment-reply {
        top: 30px;
    }
    .postCommetnListBox ol ul {
        margin: 0 0 0 15px;
    }
    .blogDetailsContentArea {
        padding: 34px 24px 36px 24px;
    }
    .blogDetailscontent blockquote {
        padding: 47px 0 0 0;
    }
    .blogDetailscontent blockquote p {
        font-size: 16px;
        line-height: 28px;
    }
    /* About Page */
    .aiCounter {
        width: 140px;
        height: 140px;
        padding: 27px;
        top: 116px;
        left: 32%;
        margin: 24px auto 0;
    }
    .aiCounter h2 {
        font-size: 36px;
        line-height: 1;
    }
    .aiCounter h3 {
        font-size: 18px;
        line-height: 25px;
    }
    .teamCarousel.owl-carousel .owl-nav {
        position: relative;
        right: 0;
        top: 0;
        left: 0;
        margin: 20px 0 0;
        text-align: center;
    }
    .productQuickView button.quickViewCloser{
        right: 5px;
        top: 5px;
    }
}


/*----------------========----------------
/  13. min-width: 320px & max-width: 410px
/----------------========----------------*/
@media (min-width: 320px) and (max-width: 410px){
    .recentPost {
        padding: 0 0 0 93px;
    }
    .recentPost img {
        width: 70px;
        height: 70px;
    }
    .recentPost h4 {
        font-size: 16px;
        line-height: 22px;
    }
    .postTags a {
        height: 36px;
        font-size: 14px;
        line-height: 36px;
        padding: 0 14px;
    }
    /* About Page */
    .aiImgRow img.aiImg01 {
        width: 145px;
        height: auto;
        max-width: 100%;
        float: none !important;
        margin: 23px 10px 0 0;
    }
    .aiImgRow img.aiImg02 {
        width: 147px;
        max-width: 100%;
    }
    .aiImgRow img.aiImg03{
        max-width: 100%;
        width: 105px;
        height: auto;
        float: none !important;
        margin: 0 10px 0 0;
    }
    .aiImgRow img.aiImg04 {
        max-width: 100%;
        width: 188px;
        height: auto;
        margin: 0;
    }
    .aiCounter {
        position: absolute;
        left: 70px;
        top: 69px;
        padding: 27px;
    }
    .aiCounter h2 {
        font-size: 36px;
        line-height: 1;
    }
    .aiCounter h3 {
        font-size: 18px;
        line-height: 25px;
    }
    .abcCounters{
        display: block;
    }
    .abps02Con .secTitle{
        font-size: 36px;
        line-height: 1;
    }
}


/*----------------========----------------
/  14. min-width: 320px & max-width: 355px
/----------------========----------------*/
@media (min-width: 320px) and (max-width: 355px){
    /* TestimonialPage */
    .testimonialItem01{
        padding: 30px 40px;
    }
    .ti01Content {
        font-size: 16px;
        line-height: 28px;
    }
    /* Contact Section */
    .contactItem{
        padding-left: 90px;
    }
    .contactItem span{
        width: 60px;
        height: 60px;
    }
    .contactItem span i{
        font-size: 16px;
    }
    /* Footer Section */
    .footerPayments{
        font-size: 34px;
    }
    .footerNav ul{
        display: block;
        text-align: center;
    }
    .footerNav ul li{
        display: inline-block;
        margin: 0 25px 0 0;
    }
    
    /* Blog Standard */
    .bi04Detail {
        padding: 34px 24px 42px 24px;
    }
    .bi04Detail h2 {
        font-size: 28px;
        line-height: 38px;
    }
    .sidebar .widget {
        padding: 43px 24px 48px;
    }
    .sidebar .widget.tagCloudWid{
        padding-right: 24px;
    }
}
/* ==========================================================================
   Main Styles вЂ” Р“СЂР°РЅС–С‚РЅС– РїР°Рј'СЏС‚РЅРёРєРё (granit-maister.com.ua)
   ========================================================================== */

/* Variables
   ========================================================================== */
:root {
    /* Р¤РѕРЅРё */
    --color-bg: #0F1115;
    --color-bg-alt: #0A0B0D;
    --color-surface: #171A21;
    --color-surface-light: #1E222B;

    /* РўРµРєСЃС‚ */
    --color-white: #FFFFFF;
    --color-text: #F2F4F8;
    --color-text-secondary: #A8AFBD;
    --color-text-muted: #6B7280;

    /* РђРєС†РµРЅС‚Рё */
    --color-accent: #C8A15A;
    --color-accent-hover: #B08D4E;
    --color-accent-light: #D4B06A;

    /* РњРµР¶С– */
    --color-border: #2A2F3A;
    --color-border-light: #3A4050;

    /* РЁСЂРёС„С‚Рё */
    --font-heading: 'Lora', Georgia, serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* Transitions */
    --transition: 0.2s ease;
    --transition-slow: 0.3s ease;
}

/* Base
   ========================================================================== */
* {
    box-sizing: border-box;
}

body {
    font-family: var(--font-body);
    font-size: 18px;
    line-height: 1.65;
    color: var(--color-text-secondary);
    background: var(--color-bg);
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: var(--color-accent);
    text-decoration: none;
    transition: color var(--transition);
}

a:hover {
    color: var(--color-accent-hover);
}

/* Typography
   ========================================================================== */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    color: var(--color-text);
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 0.5em;
}

/* Header
   ========================================================================== */
.header01 {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 100;
    width: 100%;
    padding: 0 20px;
    background: rgba(15, 17, 21, 0.85);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(42, 47, 58, 0.5);
    transition: all 0.3s ease;
}

.header01.fixedHeader {
    background: rgba(15, 17, 21, 0.98);
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);
}

.header01.fixedHeader .headerInner01 {
    padding: 8px 0;
}

/* Header shrink on scroll */
.header01.fixedHeader .mainMenu > ul > li {
    padding: 12px 0;
}

.header01.fixedHeader .logo-text {
    font-size: 21px;
}

.header01.fixedHeader .header-phone {
    padding: 7px 14px;
    font-size: 14px;
}

.header01.fixedHeader .header-messenger {
    width: 36px;
    height: 36px;
}

.header01.fixedHeader .header-messenger img {
    width: 20px;
    height: 20px;
}

.headerInner01 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
    transition: padding 0.3s ease;
}

/* Logo */
.logo-text {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 700;
    color: var(--color-text);
    text-decoration: none;
    letter-spacing: -0.5px;
    transition: font-size 0.3s ease;
}

.logo-text span {
    color: var(--color-accent);
}

.logo-text:hover {
    color: var(--color-text);
}

.logo-text:hover span {
    color: var(--color-accent-light);
}

/* Main Menu */
.mainMenu {
    font-family: var(--font-body);
    margin-left: 80px;
}

.mainMenu ul {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    list-style: none;
}

.mainMenu > ul > li {
    padding: 28px 0;
    margin: 0 28px 0 0;
    transition: padding 0.3s ease;
}

.mainMenu > ul > li:last-child {
    margin-right: 0;
}

.mainMenu ul li a {
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.2px;
    color: var(--color-text-secondary);
    text-decoration: none;
    transition: color var(--transition);
}

.mainMenu ul li a:hover,
.mainMenu ul li.current-menu-item > a {
    color: var(--color-accent);
}

/* Dropdown arrow */
.mainMenu ul li.menu-item-has-children > a::after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
    margin-left: 8px;
    margin-bottom: 3px;
    opacity: 0.5;
    transition: transform var(--transition);
}

.mainMenu ul li.menu-item-has-children:hover > a::after {
    transform: rotate(-135deg);
    margin-bottom: 0;
}

/* Dropdown Menu */
.mainMenu ul li ul {
    position: absolute;
    top: 100%;
    left: -20px;
    min-width: 260px;
    padding: 16px 0;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.4);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all var(--transition);
}

.mainMenu ul li:hover > ul {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.mainMenu ul li ul li {
    display: block;
    padding: 0;
    margin: 0;
}

.mainMenu ul li ul li a {
    display: block;
    padding: 12px 24px;
    font-size: 15px;
    font-weight: 500;
    color: var(--color-text-secondary);
}

.mainMenu ul li ul li a:hover {
    color: var(--color-accent);
    background: var(--color-surface-light);
}

/* Header Contacts */
.header-contacts {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-left: auto;
}

.header-phone {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    color: var(--color-accent);
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.header-phone:hover {
    background: var(--color-surface-light);
    border-color: var(--color-accent);
    color: var(--color-accent);
    transform: translateY(-1px);
}

.header-phone-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.header-phone span {
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.3px;
}

.header-messengers {
    display: flex;
    align-items: center;
    gap: 8px;
}

.header-messenger {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 50%;
    transition: all 0.3s ease;
}

.header-messenger:hover {
    background: var(--color-surface-light);
    border-color: var(--color-accent);
    transform: scale(1.05);
}

.header-messenger img {
    width: 22px;
    height: 22px;
    object-fit: contain;
    opacity: 0.7;
    filter: saturate(0.6);
    transition: all var(--transition);
}

.header-messenger:hover img {
    opacity: 1;
    filter: saturate(1);
}

/* Hero Section
   ========================================================================== */
.hero {
    position: relative;
    padding: 160px 0 100px;
    background: var(--color-bg);
    overflow: hidden;
}

/* Hero Background with texture and gradient */
.hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;

    /* Granite-like noise texture */
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
    opacity: 0.04;
}

/* Center glow / spotlight effect */
.hero::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 120%;
    height: 100%;
    background: radial-gradient(
        ellipse 60% 50% at 50% 40%,
        rgba(200, 161, 90, 0.06) 0%,
        rgba(200, 161, 90, 0.02) 40%,
        transparent 70%
    );
    pointer-events: none;
    z-index: 1;
}

/* Top gradient fade */
.hero::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 200px;
    background: linear-gradient(to bottom, rgba(15, 17, 21, 0.8), transparent);
    pointer-events: none;
    z-index: 1;
}

.hero .container {
    position: relative;
    z-index: 2;
}

.hero-content {
    text-align: center;
    max-width: 900px;
    margin: 0 auto 60px;
}

.hero h1 {
    font-family: var(--font-heading);
    font-size: 56px;
    font-weight: 700;
    line-height: 1.15;
    margin: 0 0 48px;
    color: var(--color-text);
    letter-spacing: -0.02em;
}

.hero-highlight {
    color: var(--color-accent);
}

/* Hero Features - Pill badges */
.hero-features {
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

.hero-feature {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 22px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 50px;
    transition: all var(--transition);
}

.hero-feature:hover {
    border-color: var(--color-border-light);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.hero-feature svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    stroke: var(--color-accent);
}

.hero-feature span {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-secondary);
}

/* Hero CTA Block */
.hero-cta {
    max-width: 560px;
    margin: 0 auto;
    padding: 28px 36px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 20px;
    text-align: center;
}

.hero-cta-title {
    font-family: var(--font-body);
    font-size: 17px;
    font-weight: 500;
    color: var(--color-text);
    margin: 0 0 24px;
}

.hero-cta-buttons {
    display: flex;
    justify-content: center;
    gap: 40px;
}

.hero-cta-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    transition: transform var(--transition);
}

.hero-cta-btn:hover {
    transform: translateY(-4px);
}

.hero-cta-btn img {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    opacity: 0.4;
    filter: saturate(0.7);
    transition: all var(--transition);
}

.hero-cta-btn:hover img {
    transform: scale(1.08);
    opacity: 1;
    filter: saturate(1);
}

.hero-cta-btn span {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text-secondary);
}

/* Categories Section
   ========================================================================== */
.categories-section {
    padding: 100px 0;
    background: var(--color-surface);
    border-top: 1px solid var(--color-border);
}

/* Section Header */
.section-header {
    text-align: center;
    margin-bottom: 60px;
}

.section-header h2 {
    font-family: var(--font-heading);
    font-size: 36px;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 12px;
}

.section-header h2 .highlight {
    color: var(--color-accent);
}

.section-header p {
    font-family: var(--font-body);
    font-size: 18px;
    color: var(--color-text-secondary);
    margin: 0;
}

/* Category Card */
.category-card {
    display: block;
    position: relative;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 24px;
    text-decoration: none;
    transition: all var(--transition-slow);
    -webkit-user-drag: none;
    user-drag: none;
}

.category-card:hover {
    border-color: var(--color-border-light);
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

/* Category Image */
.category-image {
    position: relative;
    aspect-ratio: 1 / 1;
    background: var(--color-surface-light);
    overflow: hidden;
}

.category-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.category-card:hover .category-image img {
    transform: scale(1.08);
}

/* Category Content */
.category-content {
    padding: 20px;
    text-align: center;
    position: relative;
    z-index: 2;
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

.category-card img {
    -webkit-user-drag: none;
    user-drag: none;
    pointer-events: none;
}

.category-content h3 {
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 4px;
}

.category-desc {
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-text-muted);
    margin: 0 0 12px;
}

.category-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-accent);
    transition: gap var(--transition);
}

.category-card:hover .category-link {
    gap: 10px;
}

.category-link .arrow-icon {
    transition: transform 0.3s ease;
}

.category-card:hover .arrow-icon {
    transform: translateX(4px);
}

/* CTA Section
   ========================================================================== */
.cta-section {
    padding: 60px 0;
    background: var(--color-bg);
}

.cta-content {
    background: linear-gradient(135deg, #9ebbbd 0%, #7b9496 100%);
    padding: 48px 60px;
    border-radius: 24px;
    text-align: center;
}

.cta-content h3 {
    font-family: var(--font-heading);
    font-size: 26px;
    font-weight: 600;
    color: #212529;
    margin: 0 0 10px;
}

.cta-subtitle {
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 400;
    color: #212529;
    margin: 0 0 28px;
}

.cta-buttons {
    display: flex;
    justify-content: center;
    gap: 48px;
}

.cta-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    transition: transform var(--transition);
}

.cta-btn:hover {
    transform: translateY(-4px);
}

.cta-btn-icon {
    position: relative;
    width: 60px;
    height: 60px;
    margin-bottom: 12px;
}

.cta-btn-icon img {
    width: 100%;
    height: 100%;
    border-radius: 16px;
    transition: transform var(--transition);
}

/* Overlay РґР»СЏ РїСЂРёРіР»СѓС€РµРЅРёСЏ РёРєРѕРЅРѕРє */
.cta-btn-icon::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.45);
    border-radius: 16px;
    transition: background var(--transition);
}

.cta-btn:hover .cta-btn-icon::after {
    background: rgba(0, 0, 0, 0.2);
}

.cta-btn:hover .cta-btn-icon img {
    transform: scale(1.08);
}

.cta-btn span {
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: 500;
    color: #3a3f44;
}

/* Popular Section
   ========================================================================== */
.popular-section {
    padding: 100px 0;
    background: var(--color-bg);
    position: relative;
    overflow: hidden;
}

/* Decorative dots pattern */
.popular-section::before {
    content: '';
    position: absolute;
    top: 80px;
    right: 5%;
    width: 120px;
    height: 120px;
    background-image: radial-gradient(var(--color-accent) 2px, transparent 2px);
    background-size: 16px 16px;
    opacity: 0.15;
    z-index: 0;
}

.popular-section::after {
    content: '';
    position: absolute;
    bottom: 80px;
    left: 3%;
    width: 80px;
    height: 80px;
    background-image: radial-gradient(var(--color-accent) 2px, transparent 2px);
    background-size: 16px 16px;
    opacity: 0.1;
    z-index: 0;
}

.popular-section .container {
    position: relative;
    z-index: 1;
}

/* Product Card */
.product-card {
    display: block;
    position: relative;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 24px;
    text-decoration: none;
    transition: all var(--transition-slow);
    -webkit-user-drag: none;
    user-drag: none;
}

.product-card:hover {
    border-color: var(--color-border-light);
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
}

/* Product Badge */
.product-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 2;
    padding: 6px 14px;
    background: transparent;
    color: var(--color-accent);
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    border-radius: 50px;
    border: 1px solid var(--color-accent);
}

/* Product Image */
.product-image {
    position: relative;
    aspect-ratio: 4 / 5;
    background: var(--color-surface-light);
    overflow: hidden;
}

.product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.product-card:hover .product-image img {
    transform: scale(1.06);
}

/* Product Info */
.product-info {
    padding: 20px;
    position: relative;
    z-index: 2;
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

.product-card img {
    -webkit-user-drag: none;
    user-drag: none;
    pointer-events: none;
}

.product-info h4 {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 6px;
}

.product-type {
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-text-muted);
    margin: 0 0 12px;
}

.product-price {
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-text-secondary);
    margin: 0;
}

.product-price strong {
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 600;
    color: var(--color-accent);
}

/* Product Details */
.product-details {
    margin: 12px 0;
    padding: 12px 0;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}

.product-details p {
    font-size: 12px;
    color: var(--color-text-secondary);
    margin: 0 0 6px;
    line-height: 1.4;
}

.product-details p:last-child {
    margin-bottom: 0;
}

.product-sizes span {
    color: var(--color-text);
    font-weight: 500;
}

.product-delivery span,
.product-montage span {
    color: var(--color-text);
    font-weight: 500;
}

.product-extras {
    font-style: italic;
    color: var(--color-text-secondary);
}

/* Product Pricing */
.product-pricing {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.price-old {
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-text-secondary);
    opacity: 0.6;
    text-decoration: line-through;
}

.price-sale {
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 600;
    color: var(--color-accent);
}

.price-sale::before {
    content: 'Вартість за акцією: ';
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: 400;
    color: var(--color-text-secondary);
    display: block;
    margin-bottom: 2px;
}

/* Section Footer */
.section-footer {
    text-align: center;
    margin-top: 40px;
}

.btn-outline {
    display: inline-block;
    padding: 16px 36px;
    background: transparent;
    color: var(--color-accent);
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    border: 2px solid var(--color-accent);
    border-radius: 50px;
    transition: all var(--transition);
}

.btn-outline:hover {
    background: var(--color-accent);
    color: var(--color-bg);
}

/* Responsive
   ========================================================================== */
@media (max-width: 1199px) {
    .mainMenu {
        margin-left: 50px;
    }

    .mainMenu > ul > li {
        margin: 0 20px 0 0;
    }
}

@media (max-width: 991px) {
    .hero h1 {
        font-size: 42px;
    }

    .hero-features {
        gap: 12px;
    }

    .hero-cta-buttons {
        gap: 24px;
    }

    .section-header h2 {
        font-size: 30px;
    }

    .mainMenu {
        margin-left: 30px;
    }
}

@media (max-width: 767px) {
    .hero {
        padding: 130px 0 70px;
    }

    .hero h1 {
        font-size: 32px;
        margin-bottom: 32px;
    }

    .hero-features {
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }

    .hero-feature {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }

    .hero-content {
        margin-bottom: 40px;
    }

    .hero-cta {
        padding: 24px;
        border-radius: 16px;
    }

    .hero-cta-title {
        font-size: 16px;
    }

    .hero-cta-buttons {
        gap: 20px;
    }

    .hero-cta-btn img {
        width: 48px;
        height: 48px;
    }

    .categories-section {
        padding: 60px 0;
    }

    .section-header {
        margin-bottom: 40px;
    }

    .section-header h2 {
        font-size: 26px;
    }

    .section-header p {
        font-size: 16px;
    }

    .category-content {
        padding: 16px;
    }

    .category-content h3 {
        font-size: 18px;
    }

    /* CTA Responsive */
    .cta-content {
        padding: 32px 24px;
        border-radius: 20px;
    }

    .cta-content h3 {
        font-size: 22px;
    }

    .cta-subtitle {
        font-size: 15px;
    }

    .cta-buttons {
        gap: 24px;
    }

    .cta-btn img {
        width: 52px;
        height: 52px;
        padding: 8px;
    }

    /* Popular Responsive */
    .popular-section {
        padding: 60px 0;
    }

    .popular-section::before,
    .popular-section::after {
        display: none;
    }

    .product-info {
        padding: 16px;
    }

    .product-info h4 {
        font-size: 16px;
    }

    .product-price strong {
        font-size: 18px;
    }

    .product-details {
        margin: 10px 0;
        padding: 10px 0;
    }

    .product-details p {
        font-size: 11px;
        margin-bottom: 4px;
    }

    .price-old {
        font-size: 12px;
    }

    .price-sale {
        font-size: 18px;
    }

    .price-sale::before {
        font-size: 10px;
    }
}


/* ========================================
   INFO TABS SECTION
======================================== */
.info-tabs-section {
    padding: 100px 0;
    background: var(--color-surface);
}

.info-tabs-wrapper {
    max-width: 960px;
    margin: 0 auto;
}

/* Tabs Navigation */
.tabs-nav {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.tab-btn {
    padding: 14px 28px;
    background: rgba(255, 255, 255, 0.05);
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 50px;
    font-family: var(--font-heading);
    font-size: 15px;
    font-weight: 600;
    color: var(--color-text);
    cursor: pointer;
    transition: all 0.3s ease;
}

.tab-btn:hover {
    border-color: var(--color-accent);
    color: var(--color-accent);
    background: rgba(200, 161, 90, 0.1);
}

.tab-btn.active {
    background: linear-gradient(135deg, var(--color-accent) 0%, #a88542 100%);
    color: #0F1115;
    border-color: transparent;
}

/* Tab Content */
.tabs-content {
    background: #3a3f47;
    border-radius: 24px;
    padding: 48px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.tab-panel {
    display: none;
}

.tab-panel.active {
    display: block;
}

.tab-panel h3 {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 600;
    color: var(--color-white);
    margin: 0 0 32px;
    text-align: center;
}

/* Info Grid */
.info-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.info-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 20px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.info-icon {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--color-accent) 0%, #a88542 100%);
    border-radius: 12px;
}

.info-icon svg {
    width: 22px;
    height: 22px;
    stroke: #0F1115;
}

.info-text strong {
    display: block;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 600;
    color: var(--color-white);
    margin-bottom: 4px;
}

.info-text p {
    font-size: 14px;
    color: var(--color-text);
    margin: 0;
    line-height: 1.5;
}

.info-text a {
    color: var(--color-accent);
    text-decoration: none;
    font-weight: 500;
    font-size: 14px;
}

.info-text a:hover {
    text-decoration: underline;
}

/* Locations Box */
.locations-box {
    margin-top: 24px;
    padding: 20px 24px;
    background: rgba(200, 161, 90, 0.1);
    border-radius: 12px;
    border-left: 4px solid var(--color-accent);
}

.locations-box strong {
    color: var(--color-accent);
}

.locations-box p {
    margin: 0;
    font-size: 15px;
    color: var(--color-text);
    line-height: 1.6;
}

/* Contacts Tab Specific */
.contacts-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}

.contacts-details {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.contact-item .info-icon {
    width: 44px;
    height: 44px;
}

.contact-item .info-icon svg {
    width: 20px;
    height: 20px;
}

.phone-link {
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 600;
    color: var(--color-accent);
    text-decoration: none;
}

.phone-link:hover {
    color: #d4b06a;
}

.messengers-row {
    display: flex;
    gap: 12px;
    margin-top: 8px;
}

.messengers-row .messenger-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    transition: all 0.3s ease;
    position: relative;
}

.messengers-row .messenger-link::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.25);
    border-radius: 12px;
    transition: opacity 0.3s ease;
}

.messengers-row .messenger-link:hover::after {
    opacity: 0;
}

.messengers-row .messenger-link img {
    width: 28px;
    height: 28px;
    position: relative;
    z-index: 1;
}

/* Map Container */
.map-container {
    border-radius: 16px;
    overflow: hidden;
    height: 100%;
    min-height: 280px;
}

.map-container iframe {
    width: 100%;
    height: 100%;
    min-height: 280px;
    border: none;
    filter: grayscale(30%) contrast(0.9);
}

/* Info Tabs Responsive */
@media (max-width: 991px) {
    .info-tabs-section {
        padding: 80px 0;
    }

    .tabs-content {
        padding: 36px 28px;
    }

    .info-grid {
        grid-template-columns: 1fr;
    }

    .contacts-info {
        grid-template-columns: 1fr;
    }

    .map-container {
        min-height: 250px;
    }
}

@media (max-width: 767px) {
    .info-tabs-section {
        padding: 60px 0;
    }

    .tabs-nav {
        gap: 8px;
    }

    .tab-btn {
        padding: 12px 20px;
        font-size: 14px;
    }

    .tabs-content {
        padding: 28px 20px;
        border-radius: 20px;
    }

    .tab-panel h3 {
        font-size: 20px;
        margin-bottom: 24px;
    }

    .info-item {
        padding: 16px;
    }

    .info-icon {
        width: 42px;
        height: 42px;
    }

    .info-icon svg {
        width: 20px;
        height: 20px;
    }

    .info-text strong {
        font-size: 15px;
    }

    .info-text p {
        font-size: 13px;
    }

    .phone-link {
        font-size: 18px;
    }

    .map-container {
        min-height: 220px;
    }
}


/* ========================================
   MOBILE MENU
======================================== */
.menuToggler {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 32px;
    height: 32px;
    padding: 4px;
    background: none;
    border: none;
    cursor: pointer;
}

.menuToggler span {
    display: block;
    width: 100%;
    height: 2px;
    background: var(--color-white);
    transition: all 0.3s ease;
}

.menuToggler.active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

.menuToggler.active span:nth-child(2) {
    opacity: 0;
}

.menuToggler.active span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
}

@media (max-width: 1365px) {
    .menuToggler {
        display: flex;
    }
    .mainMenu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--color-surface);
        border-top: 1px solid var(--color-border);
        padding: 20px;
    }

    .mainMenu.active {
        display: block;
    }

    .mainMenu > ul {
        flex-direction: column;
        gap: 0;
    }

    .mainMenu > ul > li {
        padding: 0;
    }

    .mainMenu > ul > li > a {
        display: block;
        padding: 14px 0;
        border-bottom: 1px solid var(--color-border);
    }

    /* Mobile dropdown */
    .mainMenu ul li ul {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: none;
        box-shadow: none;
        border: none;
        border-radius: 0;
        padding: 0;
        background: transparent;
        padding-left: 20px;
    }

    .mainMenu ul li ul.show {
        display: block;
    }

    .mainMenu ul li ul li a {
        padding: 12px 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    }
}

/* Header Mobile (small screens) */
@media (max-width: 575px) {
    .headerInner01 {
        padding: 12px 0;
    }

    .header-phone {
        padding: 8px 12px;
        gap: 6px;
    }

    .header-phone span {
        display: none;
    }

    .header-phone-icon {
        width: 20px;
        height: 20px;
    }

    .header-messengers {
        gap: 6px;
    }

    .header-messenger {
        width: 36px;
        height: 36px;
    }

    .logo-text {
        font-size: 18px;
    }

    .menuToggler {
        display: flex;
        padding: 8px;
    }

    .menuToggler span {
        display: block;
        width: 24px;
        height: 2px;
        background: var(--color-white);
    }
}


/* ========================================
   WHY US SECTION
======================================== */
.why-us-section {
    padding: 100px 0;
    background: var(--color-bg);
}

.why-us-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.why-us-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 32px;
    text-align: center;
    transition: all 0.3s ease;
}

.why-us-card:hover {
    border-color: var(--color-accent);
    transform: translateY(-4px);
}

.why-us-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--color-accent) 0%, #a88542 100%);
    border-radius: 16px;
}

.why-us-icon svg {
    width: 32px;
    height: 32px;
    stroke: #0F1115;
}

.why-us-card h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 600;
    color: var(--color-white);
    margin: 0 0 12px;
}

.why-us-card p {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 991px) {
    .why-us-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 575px) {
    .why-us-section {
        padding: 60px 0;
    }

    .why-us-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .why-us-card {
        padding: 24px;
    }
}


/* ========================================
   PROCESS SECTION
======================================== */
.process-section {
    padding: 100px 0;
    background: var(--color-surface);
}

.process-steps {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    position: relative;
}

.process-steps::before {
    content: '';
    position: absolute;
    top: 32px;
    left: 50px;
    right: 50px;
    height: 2px;
    background: linear-gradient(90deg, var(--color-accent) 0%, var(--color-border) 100%);
}

.process-step {
    flex: 1;
    text-align: center;
    position: relative;
    z-index: 1;
}

.step-number {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-surface);
    border: 3px solid var(--color-accent);
    border-radius: 50%;
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 700;
    color: var(--color-accent);
}

.process-step h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 600;
    color: var(--color-white);
    margin: 0 0 10px;
}

.process-step p {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.5;
    margin: 0;
}

@media (max-width: 991px) {
    .process-steps {
        flex-direction: column;
        gap: 32px;
    }

    .process-steps::before {
        display: none;
    }

    .process-step {
        display: flex;
        text-align: left;
        gap: 20px;
    }

    .step-number {
        flex-shrink: 0;
        width: 56px;
        height: 56px;
        margin: 0;
    }
}

@media (max-width: 575px) {
    .process-section {
        padding: 60px 0;
    }

    .step-number {
        width: 48px;
        height: 48px;
        font-size: 20px;
    }
}


/* ========================================
   FAQ SECTION
======================================== */
.faq-section {
    padding: 100px 0;
    background: var(--color-bg);
}

.faq-list {
    max-width: 800px;
    margin: 0 auto;
}

.faq-item {
    border: 1px solid var(--color-border);
    border-radius: 12px;
    margin-bottom: 12px;
    overflow: hidden;
    background: var(--color-surface);
}

.faq-question {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
}

.faq-question span {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 600;
    color: #E8E6E3;
    padding-right: 20px;
}

.faq-question svg {
    width: 20px;
    height: 20px;
    stroke: #9A9A9A;
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.faq-item.active .faq-question svg {
    transform: rotate(180deg);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    padding: 0 24px;
    transition: max-height 0.3s ease, padding 0.3s ease;
}

.faq-item.active .faq-answer {
    max-height: 300px;
    padding: 0 24px 20px;
}

.faq-answer p {
    font-size: 15px;
    color: #9A9A9A;
    line-height: 1.7;
    margin: 0;
}

@media (max-width: 575px) {
    .faq-section {
        padding: 60px 0;
    }

    .faq-question {
        padding: 16px 20px;
    }

    .faq-question span {
        font-size: 15px;
    }

    .faq-answer {
        padding: 0 20px;
    }

    .faq-item.active .faq-answer {
        padding: 0 20px 16px;
    }

    .faq-answer p {
        font-size: 14px;
    }
}


/* ========================================
   FOOTER
======================================== */
.footer {
    padding: 60px 0 0;
    background: var(--color-surface);
    border-top: 1px solid var(--color-border);
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 40px;
    padding-bottom: 40px;
}

.footer-logo {
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 700;
    color: var(--color-text);
    text-decoration: none;
    display: inline-block;
    margin-bottom: 16px;
}

.footer-logo span {
    color: var(--color-accent);
}

.footer-about p {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.6;
    margin: 0;
}

.footer-col h4 {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 600;
    color: var(--color-white);
    margin: 0 0 20px;
}

.footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-col ul li {
    margin-bottom: 10px;
}

.footer-col ul li a {
    font-size: 14px;
    color: var(--color-text-secondary);
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-col ul li a:hover {
    color: var(--color-accent);
}

.footer-contacts p {
    font-size: 14px;
    color: var(--color-text-secondary);
    margin: 0 0 12px;
    line-height: 1.5;
}

.footer-contacts p strong {
    color: var(--color-text);
}

.footer-contacts a {
    color: var(--color-accent);
    text-decoration: none;
}

.footer-contacts a:hover {
    text-decoration: underline;
}

.footer-messengers {
    display: flex;
    gap: 12px;
    margin-top: 16px;
}

.footer-messengers a {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    position: relative;
    transition: all 0.3s ease;
}

.footer-messengers a::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    transition: opacity 0.3s ease;
}

.footer-messengers a:hover::after {
    opacity: 0;
}

.footer-messengers img {
    width: 24px;
    height: 24px;
    position: relative;
    z-index: 1;
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
    border-top: 1px solid var(--color-border);
}

.footer-bottom p {
    font-size: 13px;
    color: var(--color-text-secondary);
    margin: 0;
}

.footer-bottom a {
    font-size: 13px;
    color: var(--color-text-secondary);
    text-decoration: none;
}

.footer-bottom a:hover {
    color: var(--color-accent);
}

@media (max-width: 991px) {
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }
}

@media (max-width: 575px) {
    .footer {
        padding: 40px 0 0;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 12px;
        text-align: center;
    }
}


/* ==========================================================================
   CATEGORY PAGE STYLES
   ========================================================================== */

/* Breadcrumbs */
.breadcrumbs {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px 0;
    margin-bottom: 24px;
    font-family: var(--font-body);
    font-size: 14px;
}

.breadcrumbs a {
    color: var(--color-text-muted);
    text-decoration: none;
    transition: color var(--transition);
}

.breadcrumbs a:hover {
    color: var(--color-accent);
}

.breadcrumb-sep {
    color: var(--color-text-muted);
    opacity: 0.5;
}

.breadcrumb-current {
    color: var(--color-text);
}

/* Category Hero */
.category-hero {
    padding-top: 140px;
}

.category-hero .hero-content {
    padding-bottom: 20px;
}

/* Category Description */
.category-description {
    padding: 60px 0;
    background: var(--color-surface);
}

.category-text {
    max-width: 900px;
    margin: 0 auto;
}

.category-text p {
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.7;
    color: var(--color-text-secondary);
    margin-bottom: 16px;
}

.category-features-list {
    list-style: none;
    padding: 0;
    margin: 24px 0 0;
}

.category-features-list li {
    position: relative;
    padding-left: 24px;
    font-family: var(--font-body);
    font-size: 15px;
    color: var(--color-text-secondary);
    margin-bottom: 10px;
}

.category-features-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    width: 8px;
    height: 8px;
    background: var(--color-accent);
    border-radius: 50%;
}

/* Products Section */
.products-section {
    padding: 80px 0;
    background: var(--color-bg);
}

/* Popular Options Section */
.popular-options-section {
    padding: 80px 0;
    background: var(--color-surface);
}

.options-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 20px;
}

.option-card {
    display: block;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 20px;
    text-align: center;
    text-decoration: none;
    transition: all var(--transition);
    -webkit-user-drag: none;
    user-drag: none;
}

.option-card:hover {
    border-color: var(--color-border-light);
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
}

.option-image {
    aspect-ratio: 1 / 1;
    margin-bottom: 16px;
    border-radius: 12px;
    overflow: hidden;
    background: var(--color-surface-light);
}

.option-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
    -webkit-user-drag: none;
    user-drag: none;
    pointer-events: none;
}

.option-card:hover .option-image img {
    transform: scale(1.08);
}

.option-card h3 {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 6px;
}

.option-card p {
    font-family: var(--font-body);
    font-size: 13px;
    color: var(--color-text-muted);
    margin: 0;
}

/* How to Choose Section */
.how-to-choose-section {
    padding: 80px 0;
    background: var(--color-bg);
}

.choose-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.choose-item {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 28px;
    transition: all var(--transition);
}

.choose-item:hover {
    border-color: var(--color-border-light);
}

.choose-icon {
    width: 48px;
    height: 48px;
    background: var(--color-accent);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.choose-icon svg {
    width: 24px;
    height: 24px;
    stroke: #1a1a1a;
}

.choose-item h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 10px;
}

.choose-item p {
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 1.6;
    color: var(--color-text-secondary);
    margin: 0;
}

/* Installation Section */
.installation-section {
    padding: 80px 0;
    background: var(--color-surface);
}

.installation-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
}

.installation-text h2 {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 12px;
}

.installation-text h2 .highlight {
    color: var(--color-accent);
}

.installation-text > p {
    font-family: var(--font-body);
    font-size: 16px;
    color: var(--color-text-secondary);
    margin: 0 0 24px;
}

.installation-list {
    list-style: none;
    padding: 0;
    margin: 0 0 28px;
}

.installation-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: var(--font-body);
    font-size: 15px;
    color: var(--color-text);
    margin-bottom: 14px;
}

.installation-list li svg {
    width: 20px;
    height: 20px;
    stroke: var(--color-accent);
    flex-shrink: 0;
}

.installation-image {
    border-radius: 16px;
    overflow: hidden;
}

.installation-image img {
    width: 100%;
    height: auto;
    display: block;
}

/* Button Primary */
.btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    background: var(--color-accent);
    color: #1a1a1a;
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 8px;
    transition: all var(--transition);
}

.btn-primary:hover {
    background: var(--color-accent-hover);
    transform: translateY(-2px);
}

/* Works Section */
.works-section {
    padding: 80px 0;
    background: var(--color-bg);
}

.works-gallery {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 40px;
}

.work-item {
    position: relative;
    display: block;
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 4 / 3;
}

.work-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.work-item:hover img {
    transform: scale(1.08);
}

.work-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 12px 16px;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
    font-family: var(--font-body);
    font-size: 13px;
    color: #fff;
}

/* Related Categories Section */
.related-categories-section {
    padding: 60px 0;
    background: var(--color-surface);
}

.category-card-mini {
    display: block;
    text-align: center;
    text-decoration: none;
    padding: 16px;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    transition: all var(--transition);
    margin-bottom: 20px;
    -webkit-user-drag: none;
    user-drag: none;
}

.category-card-mini:hover {
    border-color: var(--color-border-light);
    transform: translateY(-4px);
}

.category-mini-image {
    aspect-ratio: 1 / 1;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 12px;
    background: var(--color-surface-light);
}

.category-mini-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
    -webkit-user-drag: none;
    user-drag: none;
    pointer-events: none;
}

.category-card-mini:hover .category-mini-image img {
    transform: scale(1.08);
}

.category-card-mini span {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text);
}

/* Category Page Responsive */
@media (max-width: 1199px) {
    .options-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 991px) {
    .category-hero {
        padding-top: 120px;
    }

    .choose-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .installation-content {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .installation-image {
        order: -1;
    }

    .works-gallery {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .options-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .choose-grid {
        grid-template-columns: 1fr;
    }

    .installation-text h2 {
        font-size: 26px;
    }
}

@media (max-width: 575px) {
    .category-hero {
        padding-top: 100px;
    }

    .breadcrumbs {
        font-size: 13px;
    }

    .category-description {
        padding: 40px 0;
    }

    .category-text p {
        font-size: 15px;
    }

    .products-section,
    .popular-options-section,
    .how-to-choose-section,
    .installation-section,
    .works-section {
        padding: 60px 0;
    }

    .works-gallery {
        grid-template-columns: 1fr;
    }

    .related-categories-section {
        padding: 40px 0;
    }
}


/* ==========================================================================
   PRODUCT PAGE STYLES
   ========================================================================== */

/* Product Hero */
.product-hero {
    padding-top: 140px;
    padding-bottom: 40px;
}

.product-hero .hero-content {
    padding-bottom: 0;
}

/* Product Details Section */
.product-details-section {
    padding: 60px 0;
    background: var(--color-surface);
}

.product-details-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
}

/* Product Gallery */
.product-gallery {
    position: sticky;
    top: 100px;
}

.product-main-image {
    position: relative;
    aspect-ratio: 1 / 1;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 16px;
}

.product-main-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-badge-large {
    position: absolute;
    top: 16px;
    left: 16px;
    padding: 8px 16px;
    background: var(--color-accent);
    color: #1a1a1a;
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 600;
    border-radius: 6px;
}

.product-thumbnails {
    display: flex;
    gap: 12px;
}

.product-thumb {
    width: 80px;
    height: 80px;
    padding: 0;
    border: 2px solid var(--color-border);
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    background: var(--color-bg);
    transition: border-color var(--transition);
}

.product-thumb:hover,
.product-thumb.active {
    border-color: var(--color-accent);
}

.product-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Product Info Block */
.product-info-block {
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 32px;
}

.product-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.product-category {
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-accent);
    font-weight: 500;
}

.product-sku {
    font-family: var(--font-body);
    font-size: 13px;
    color: var(--color-text-muted);
}

.product-title {
    font-family: var(--font-heading);
    font-size: 28px;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 20px;
}

/* Product Price Block */
.product-price-block {
    background: var(--color-surface);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 24px;
}

.product-price-old {
    display: block;
    font-family: var(--font-body);
    font-size: 16px;
    color: var(--color-text-muted);
    text-decoration: line-through;
    margin-bottom: 4px;
}

.product-price-current {
    display: block;
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 700;
    color: var(--color-accent);
    margin-bottom: 4px;
}

.product-price-label {
    font-family: var(--font-body);
    font-size: 13px;
    color: var(--color-text-muted);
}

/* Product Specs */
.product-specs {
    margin-bottom: 24px;
}

.product-specs h3,
.product-services h3 {
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 12px;
}

.specs-table {
    width: 100%;
    border-collapse: collapse;
}

.specs-table tr {
    border-bottom: 1px solid var(--color-border);
}

.specs-table tr:last-child {
    border-bottom: none;
}

.specs-table td {
    padding: 10px 0;
    font-family: var(--font-body);
    font-size: 14px;
}

.specs-table td:first-child {
    color: var(--color-text-muted);
    width: 40%;
}

.specs-table td:last-child {
    color: var(--color-text);
    font-weight: 500;
}

/* Product Services */
.product-services {
    margin-bottom: 24px;
}

.services-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.services-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid var(--color-border);
}

.services-list li:last-child {
    border-bottom: none;
}

.service-name {
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-text-secondary);
}

.service-price {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text);
    white-space: nowrap;
}

/* Product CTA Block */
.product-cta-block {
    background: var(--color-surface);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 24px;
}

.product-cta-text {
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-text-secondary);
    margin: 0 0 12px;
    text-align: center;
}

.product-cta-buttons {
    display: flex;
    gap: 12px;
}

.btn-messenger {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 16px;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 8px;
    text-decoration: none;
    transition: all var(--transition);
}

.btn-messenger:hover {
    border-color: var(--color-accent);
    transform: translateY(-2px);
}

.btn-messenger img {
    width: 24px;
    height: 24px;
}

.btn-messenger span {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text);
}

.btn-phone {
    flex: 1.5;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 16px;
    background: var(--color-accent);
    border-radius: 8px;
    text-decoration: none;
    transition: all var(--transition);
}

.btn-phone:hover {
    background: var(--color-accent-hover);
    transform: translateY(-2px);
}

.btn-phone svg {
    width: 20px;
    height: 20px;
    stroke: #1a1a1a;
}

.btn-phone span {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 600;
    color: #1a1a1a;
}

/* Product Guarantees */
.product-guarantees {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.guarantee-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 12px 8px;
    background: var(--color-surface);
    border-radius: 8px;
}

.guarantee-item svg {
    width: 24px;
    height: 24px;
    stroke: var(--color-accent);
    margin-bottom: 8px;
}

.guarantee-item span {
    font-family: var(--font-body);
    font-size: 12px;
    color: var(--color-text-secondary);
    line-height: 1.3;
}

/* Product Description Section */
.product-description-section {
    padding: 60px 0;
    background: var(--color-bg);
}

.description-content {
    max-width: 800px;
}

.description-content h2 {
    font-family: var(--font-heading);
    font-size: 28px;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 20px;
}

.description-content h2 .highlight {
    color: var(--color-accent);
}

.description-content h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 600;
    color: var(--color-text);
    margin: 28px 0 12px;
}

.description-content p {
    font-family: var(--font-body);
    font-size: 15px;
    line-height: 1.7;
    color: var(--color-text-secondary);
    margin-bottom: 16px;
}

.description-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.description-content ul li {
    position: relative;
    padding-left: 20px;
    font-family: var(--font-body);
    font-size: 15px;
    color: var(--color-text-secondary);
    margin-bottom: 10px;
    line-height: 1.6;
}

.description-content ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 9px;
    width: 6px;
    height: 6px;
    background: var(--color-accent);
    border-radius: 50%;
}

.description-content ul li strong {
    color: var(--color-text);
}

/* Related Products Section */
.related-products-section {
    padding: 80px 0;
    background: var(--color-surface);
}

.related-products-section .product-card .product-details {
    display: none;
}

/* Product Page Responsive */
@media (max-width: 991px) {
    .product-hero {
        padding-top: 120px;
    }

    .product-details-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .product-gallery {
        position: static;
    }

    .product-guarantees {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .product-cta-buttons {
        flex-direction: column;
    }

    .btn-phone {
        flex: 1;
    }

    .product-thumbnails {
        flex-wrap: wrap;
    }

    .product-thumb {
        width: 60px;
        height: 60px;
    }
}

@media (max-width: 575px) {
    .product-hero {
        padding-top: 100px;
        padding-bottom: 30px;
    }

    .product-details-section {
        padding: 40px 0;
    }

    .product-info-block {
        padding: 24px;
    }

    .product-title {
        font-size: 24px;
    }

    .product-price-current {
        font-size: 28px;
    }

    .product-description-section {
        padding: 40px 0;
    }

    .description-content h2 {
        font-size: 24px;
    }

    .related-products-section {
        padding: 60px 0;
    }
}


/* ============================================================
   21. STATIC PAGES — Контакти, Про нас, Встановлення
   ============================================================ */

/* ---------- Shared: About Grid (Про нас, Kontakty intro) ---------- */

.about-section {
    padding: 80px 0;
}

.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
}

.about-text h2 {
    font-family: var(--font-heading);
    font-size: 32px;
    margin-bottom: 24px;
    color: var(--color-text);
}

.about-text p {
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin-bottom: 16px;
}

.about-image {
    border-radius: 16px;
    overflow: hidden;
}

.about-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 16px;
}

/* ---------- Why Us: .why-item / .why-icon (pages variant) ---------- */

.why-item {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 32px;
    text-align: center;
    transition: all 0.3s ease;
}

.why-item:hover {
    border-color: var(--color-accent);
    transform: translateY(-4px);
}

.why-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--color-accent) 0%, #a88542 100%);
    border-radius: 16px;
}

.why-icon svg {
    width: 32px;
    height: 32px;
    stroke: #0F1115;
}

.why-item h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    color: var(--color-text);
    margin-bottom: 10px;
}

.why-item p {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

/* ---------- Numbers Section (Про нас) ---------- */

.numbers-section {
    padding: 80px 0;
    background: var(--color-surface);
}

.numbers-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    text-align: center;
}

.number-item {
    padding: 32px 16px;
}

.number-value {
    display: block;
    font-family: var(--font-heading);
    font-size: 48px;
    font-weight: 700;
    color: var(--color-accent);
    margin-bottom: 8px;
}

.number-label {
    font-size: 16px;
    color: var(--color-text-secondary);
}

/* ---------- Materials Section (Про нас) ---------- */

.materials-section {
    padding: 80px 0;
    background: var(--color-bg);
}

.materials-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.material-item {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 24px;
    text-align: center;
    transition: border-color 0.3s ease;
}

.material-item:hover {
    border-color: var(--color-accent);
}

.material-color {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    margin: 0 auto 16px;
    border: 3px solid var(--color-border);
}

.material-item h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    color: var(--color-text);
    margin-bottom: 8px;
}

.material-item p {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

/* ---------- Contacts Page ---------- */

.contacts-section {
    padding: 80px 0;
}

.contacts-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
}

.about-short {
    margin-bottom: 32px;
}

.about-short h2 {
    font-family: var(--font-heading);
    font-size: 28px;
    color: var(--color-text);
    margin-bottom: 16px;
}

.about-short p {
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin-bottom: 8px;
}

.contacts-details {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.contact-block {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.contact-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(200, 161, 90, 0.12);
    border-radius: 12px;
}

.contact-icon svg {
    width: 22px;
    height: 22px;
    stroke: var(--color-accent);
}

.contact-text h3 {
    font-family: var(--font-heading);
    font-size: 16px;
    color: var(--color-text);
    margin-bottom: 4px;
}

.contact-text p {
    font-size: 15px;
    color: var(--color-text-secondary);
    margin-bottom: 4px;
}

.contact-text a {
    color: var(--color-text);
    text-decoration: none;
    transition: color 0.3s ease;
}

.contact-text a:hover {
    color: var(--color-accent);
}

.contact-link {
    font-size: 14px;
    color: var(--color-accent);
}

.phone-big {
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 600;
    color: var(--color-text);
    text-decoration: none;
    transition: color 0.3s ease;
}

.phone-big:hover {
    color: var(--color-accent);
}

.messengers-buttons {
    display: flex;
    gap: 12px;
    margin-top: 8px;
}

.messenger-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: var(--color-surface-light);
    border: 1px solid var(--color-border);
    border-radius: 10px;
    color: var(--color-text);
    text-decoration: none;
    font-size: 14px;
    transition: all 0.3s ease;
}

.messenger-btn:hover {
    border-color: var(--color-accent);
    background: rgba(200, 161, 90, 0.1);
}

.messenger-btn img {
    width: 24px;
    height: 24px;
}

.contacts-map-block {
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid var(--color-border);
}

.map-wrapper {
    position: relative;
    padding-bottom: 75%;
    height: 0;
}

.map-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* ---------- Services Info (Kontakty) ---------- */

.services-info-section {
    padding: 80px 0;
    background: var(--color-surface);
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.service-item {
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 32px;
    text-align: center;
    transition: all 0.3s ease;
}

.service-item:hover {
    border-color: var(--color-accent);
    transform: translateY(-4px);
}

.service-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--color-accent) 0%, #a88542 100%);
    border-radius: 16px;
}

.service-icon svg {
    width: 32px;
    height: 32px;
    stroke: #0F1115;
}

.service-item h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    color: var(--color-text);
    margin-bottom: 10px;
}

.service-item p {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

/* ---------- Locations Section (shared) ---------- */

.locations-section {
    padding: 80px 0;
    background: var(--color-bg);
}

.locations-content {
    max-width: 800px;
}

.locations-content p {
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin-bottom: 12px;
    font-size: 16px;
}

.locations-content strong {
    color: var(--color-text);
}

.locations-block {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 16px;
}

.locations-block h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    color: var(--color-accent);
    margin-bottom: 8px;
}

.locations-block p {
    color: var(--color-text-secondary);
    line-height: 1.6;
    font-size: 15px;
}

/* ---------- Service Intro (Встановлення) ---------- */

.service-intro-section {
    padding: 80px 0;
}

.service-intro-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
}

.service-intro-text h2 {
    font-family: var(--font-heading);
    font-size: 32px;
    color: var(--color-text);
    margin-bottom: 24px;
}

.service-intro-text p {
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin-bottom: 16px;
}

.service-intro-image {
    border-radius: 16px;
    overflow: hidden;
}

.service-intro-image img {
    width: 100%;
    height: auto;
    border-radius: 16px;
    object-fit: cover;
}

/* ---------- What Includes (Встановлення) ---------- */

.what-includes-section {
    padding: 80px 0;
    background: var(--color-surface);
}

.includes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.include-item {
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 32px;
    text-align: center;
    transition: all 0.3s ease;
}

.include-item:hover {
    border-color: var(--color-accent);
    transform: translateY(-4px);
}

.include-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--color-accent) 0%, #a88542 100%);
    border-radius: 16px;
}

.include-icon svg {
    width: 32px;
    height: 32px;
    stroke: #0F1115;
}

.include-item h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    color: var(--color-text);
    margin-bottom: 10px;
}

.include-item p {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

/* ---------- Prices (Встановлення) ---------- */

.service-prices-section {
    padding: 80px 0;
    background: var(--color-bg);
}

.prices-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 32px;
}

.price-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 40px 32px;
    text-align: center;
    position: relative;
    transition: all 0.3s ease;
}

.price-card:hover {
    border-color: var(--color-accent);
    transform: translateY(-4px);
}

.price-card.featured {
    border-color: var(--color-accent);
    background: var(--color-surface-light);
}

.price-badge {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--color-accent);
    color: #0F1115;
    font-size: 13px;
    font-weight: 600;
    padding: 4px 16px;
    border-radius: 20px;
}

.price-card h3 {
    font-family: var(--font-heading);
    font-size: 22px;
    color: var(--color-text);
    margin-bottom: 8px;
}

.price-desc {
    font-size: 14px;
    color: var(--color-text-muted);
    margin-bottom: 20px;
}

.price-value {
    margin-bottom: 24px;
}

.price-from {
    font-size: 14px;
    color: var(--color-text-muted);
    display: block;
    margin-bottom: 4px;
}

.price-amount {
    font-family: var(--font-heading);
    font-size: 42px;
    font-weight: 700;
    color: var(--color-accent);
}

.price-currency {
    font-size: 18px;
    color: var(--color-text-secondary);
    margin-left: 4px;
}

.price-features {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
}

.price-features li {
    padding: 10px 0;
    border-bottom: 1px solid var(--color-border);
    font-size: 15px;
    color: var(--color-text-secondary);
    padding-left: 24px;
    position: relative;
}

.price-features li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--color-accent);
    font-weight: 600;
}

.price-features li:last-child {
    border-bottom: none;
}

.prices-note {
    background: rgba(200, 161, 90, 0.08);
    border-left: 4px solid var(--color-accent);
    border-radius: 8px;
    padding: 20px 24px;
}

.prices-note p {
    color: var(--color-text-secondary);
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
}

.prices-note strong {
    color: var(--color-accent);
}

/* ---------- CTA Bottom variant (Встановлення) ---------- */

.cta-bottom {
    background: var(--color-surface);
}

/* ---------- Choose grid (pages variant with 6 items) ---------- */

.choose-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.choose-item {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 16px;
    padding: 28px;
    display: flex;
    gap: 20px;
    align-items: flex-start;
    transition: border-color 0.3s ease;
}

.choose-item:hover {
    border-color: var(--color-accent);
}

.choose-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(200, 161, 90, 0.12);
    border-radius: 12px;
}

.choose-icon svg {
    width: 24px;
    height: 24px;
    stroke: var(--color-accent);
}

.choose-item h3 {
    font-family: var(--font-heading);
    font-size: 18px;
    color: var(--color-text);
    margin-bottom: 6px;
}

.choose-item p {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

/* ---------- Installation list (category page) ---------- */

.installation-section {
    padding: 80px 0;
    background: var(--color-surface);
}

.installation-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
}

.installation-list {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

.installation-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    color: var(--color-text-secondary);
    font-size: 15px;
}

.installation-list li svg {
    width: 20px;
    height: 20px;
    min-width: 20px;
    stroke: var(--color-accent);
}

.installation-image {
    border-radius: 16px;
    overflow: hidden;
}

.installation-image img {
    width: 100%;
    height: auto;
    border-radius: 16px;
    object-fit: cover;
}

/* ---------- Popular options (category page) ---------- */

.popular-options-section {
    padding: 80px 0;
}

/* ---------- Category features list ---------- */

.category-features-list {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

.category-features-list li {
    position: relative;
    padding-left: 24px;
    padding-bottom: 10px;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.category-features-list li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--color-accent);
    font-weight: 600;
}


/* ---------- Plyty grid (2 columns) ---------- */

.plyty-grid {
    max-width: 800px;
    margin: 0 auto;
}

/* ============================================================
   22. STATIC PAGES — Responsive
   ============================================================ */

@media (max-width: 991px) {
    .about-grid,
    .contacts-grid,
    .service-intro-grid,
    .installation-content {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .numbers-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .materials-grid,
    .services-grid,
    .includes-grid,
    .prices-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .about-section,
    .contacts-section,
    .services-info-section,
    .locations-section,
    .service-intro-section,
    .what-includes-section,
    .service-prices-section,
    .numbers-section,
    .materials-section,
    .installation-section,
    .popular-options-section {
        padding: 60px 0;
    }

    .about-text h2,
    .service-intro-text h2 {
        font-size: 26px;
    }

    .numbers-grid,
    .materials-grid,
    .services-grid,
    .includes-grid,
    .prices-grid,
    .choose-grid {
        grid-template-columns: 1fr;
    }

    .number-value {
        font-size: 36px;
    }

    .price-amount {
        font-size: 32px;
    }

    .contacts-grid {
        grid-template-columns: 1fr;
    }

    .phone-big {
        font-size: 20px;
    }

    .messengers-buttons {
        flex-direction: column;
    }

    .about-grid,
    .service-intro-grid,
    .installation-content {
        grid-template-columns: 1fr;
    }
}
