.section-hero { padding-top: 120px; position: relative; background: radial-gradient(circle 310px at calc(50% - 400px) calc(50% - 400px), rgba(107, 39, 255, 0.1) 0%, rgba(107, 39, 255, 0) 100%); background-repeat: no-repeat; }
.section-hero > .top { display: grid; grid-template-columns: 0.596fr 0.403fr; }
.section-hero > .top > .left  { display: grid; grid-template-columns: 520fr 471fr; }
.section-hero > .top > .left > .left { display: flex; flex-direction: column; justify-content: center; gap: 24px; }
.section-hero > .top > .left > .left > h1 { line-height: 120%; }
.section-hero > .top > .left > .left > .dots { display: flex; gap: 12px; }
.section-hero > .top > .left > .left > .dots > .dot { width: 19px; height: 19px; border-radius: 9999px; background: linear-gradient(#bfa0ed 0%, #f6f5fb 100%);}
.section-hero > .top > .left > .left > h2 { font-weight: 400; }
.section-hero > .top > .left > .right { display: flex; flex-direction: column; gap: 42px; padding-top: 20px; }
.section-hero > .top > .left > .right > .bubble { background-color: #e7e7e74d; border-radius: 9990px; padding: 12px 25px; width: fit-content; color: #494949; display: flex; align-items: center; gap: 20px; }
.section-hero > .top > .left > .right > .bubble > .stars { display: flex; align-items: center; gap: 10px; }
.section-hero > .top > .left > .right > .bubble:first-child { align-self: flex-end; }
.section-hero > .top > .left > .right > .bubble > span { color: #6b27ff; font-weight: 700; }
.section-hero > .top > .right { display: flex; justify-content: flex-end; position: relative; padding-right: 200px; align-items: flex-end; }
.section-hero > .top > .right > .right { position: absolute; right: -250px; }
.section-hero > .top > .right > .left { width: 100%; max-width: 362px }
.section-hero > .top > .right > .left > img { width: 100%; height: auto;}
.section-hero > .middle { padding: 0px 15px; margin-bottom: 75px; }
.section-hero > .middle > .inner { background-color: #f5f5f5; border-radius: 40px; padding: 30px; box-shadow: 18px 20px 20px rgba(0, 0, 0, 0.05); display: flex; flex-direction: column; margin-bottom: 75px; }
.section-hero > .middle > .inner > picture { align-self: center; margin-top: -318px; z-index: 9; }
.section-hero > .middle > .inner > .products { margin-top: -65px; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 18px; z-index: 99; }
.section-hero > .middle > .inner > .products > .product { display: flex; flex-direction: column; }
.section-hero > .middle > .inner > .products > .product > .bg { text-decoration: none; color: #000; padding: 35px 35px 15px 35px; background-color: #fff;  transform: scale(-1, -1); border-radius: 40px; clip-path: path("M0 0H130Q90 0 90 40Q90 90 50 90H32Q0 90 0 130V100000H10000V0Z"); }
.section-hero > .middle > .inner > .products > .product > .bg > .wrapper { transform: scale(-1, -1); display: flex; flex-direction: column; justify-content: space-between; min-height: 148px; }
.section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .top { display: flex; gap: 24px; justify-content: space-between; }
.section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .top > .left > .category { color: #494949; text-transform: uppercase; }
.section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .top > .left > .name { font-weight: 900; margin-top: 4px; }
.section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .top > .right { flex-shrink: 0; text-align: right; }
.section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .top > .right > .price { font-weight: 600; color: #6b27ff; }
.section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .top > .right > .sale { margin-top: 2px; font-weight: 600; color: #494949; }
.section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .top > .right > .sale > .bottom { display: flex; gap: 10px; align-items: center; font-weight: 600; text-decoration: line-through; justify-content: flex-end; }
.section-hero > .middle > .inner > .products > .product:not(.sale) > .bg > .wrapper > .top > .right > .price { margin-top: 8px; }
.section-hero > .middle > .inner > .products > .product:not(.sale) > .bg > .wrapper > .top > .right > .sale { display: none; }
.section-hero > .middle > .inner > .products > .product > .cart { align-self: flex-end; margin-top: -81px; }
.section-hero > .middle > .inner > .products > .product > .cart > svg { width: 76px; }
.section-hero > .middle > .inner > .products > .product > .cart * { transition: fill 0.4s; }
.section-hero > .middle > .inner > .products > .product > .cart:hover circle { fill: #6b27ff;  }
.section-hero > .middle > .inner > .products > .product > .cart:hover path { fill: #fff;  }
.section-hero > .bottom { display: flex; gap: 128px; align-items: center; }
.section-hero > .bottom > .box { display: flex; gap: 8px; align-items: center; font-weight: 900; text-decoration: none; color: #000; transition: color 0.4s; }
.section-hero > .bottom > .box * { transition: stroke 0.4s; }
.section-hero > .bottom > .box:hover { color: #6b27ff; }
.section-hero > .bottom > .box:hover * { stroke: #6b27ff; }
.section-hero > .bottom > .box img { margin-right: 24px; }
.section-hero > .bottom > .label { display: none; }

.section-products { position: relative; margin-top: 50px; }
.section-products > .wrapper { display: flex; flex-direction: column; gap: 32px; }
.section-products > .wrapper > .top { display: flex; justify-content: space-between; align-items: center; }
.section-products > .wrapper > .top > .title { font-weight: 900; }
.section-products > .wrapper > .top > .title > a { display: inline-block; }

.section-products > .wrapper > .products { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 24px; }
.section-products > .wrapper > button { align-self: center; margin-top: 18px; }

.section-tabs { margin-top: 50px; position: relative; }
.section-tabs > .decor { position: absolute; left: -228px; bottom: -212px; }
.section-tabs > .decor-2 { position: absolute; right: -134px; top: -183px; }
.section-tabs > .wrapper { position: relative; }
.section-tabs > .wrapper > .text-title > a { display: inline-block; }
.section-tabs > .wrapper > .tabs { display: flex; align-items: stretch; background-color: #f5f5f5; padding: 20px; gap: 16px; border-radius: 9999px; width: fit-content; margin-top: 24px; }
.section-tabs > .wrapper > .tabs > .opt { display: flex; align-items: center; background-color: #fff; gap: 15px; padding: 15px 14px; border-radius: 6px; min-width: 250px; height: auto; color: #494949; cursor: pointer; transition: background-color 0.4s, color 0.4s; }
.section-tabs > .wrapper > .tabs > .opt > svg { flex-shrink: 0; } 
.section-tabs > .wrapper > .tabs > .opt * { fill: #494949; transition: fill 0.2s; }
.section-tabs > .wrapper > .tabs > .opt:hover { background-color: #6b27ff; color: #fff; }
.section-tabs > .wrapper > .tabs > .opt:hover * { fill: #fff; }
.section-tabs > .wrapper > .tabs > .opt.active { background-color: #6b27ff; color: #fff; }
.section-tabs > .wrapper > .tabs > .opt.active * { fill: #fff; }
.section-tabs > .wrapper > .tabs > .opt:first-child { border-radius: 9999px 0px 0px 9999px; }
.section-tabs > .wrapper > .tabs > .opt:last-child { border-radius: 0px 9999px 9999px 0px; }
.section-tabs > .wrapper > .tabs > .opt > .right > h3 { font-weight: 600;  }
.section-tabs > .wrapper > .view { margin-top: 24px; }
.section-tabs > .wrapper > .view > .tab { display: none; }
.section-tabs > .wrapper > .view > .tab.active { display: flex; flex-direction: column; gap: 24px; align-items: center; }
.section-tabs > .wrapper > .view > .tab .cards { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; width: 100%; }
.section-tabs > .wrapper > .view > .tab .cards > .card { display: flex; box-shadow: 10px 10px 30px 0 #0000000d; border-radius: 40px; border: 2px solid #f5f5f5; padding: 32px; gap: 32px; transition: border-color 0.4s; background-color: #fff; position: relative; cursor: pointer; }
.section-tabs > .wrapper > .view > .tab .cards > .card:hover { border-color: #9fc119; }
.section-tabs > .wrapper > .view > .tab .cards > .card .icon { width: 80px; height: 80px; border-radius: 9999px; background-color: #6b27ff; display: flex; justify-content: center; align-items: center; flex-shrink: 0; transition: background-color 0.4s, opacity 0.4s; }
.section-tabs > .wrapper > .view > .tab .cards > .card:hover .icon { background-color: #9fc119; opacity: 1.0 !important; }
.section-tabs > .wrapper > .view > .tab .cards > .card:hover .icon * { fill: #000; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right { width: stretch; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top { display: flex; gap: 20px; justify-content: space-between; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top > h3 { display: flex; height: 80px; align-items: center; font-weight: 900; width: 60%; font-size: inherit; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top > .badge { width: fit-content; flex-shrink: 0; background-color: #6b27ff; padding: 12px 24px; border-radius: 9999px; font-weight: 700; color: #fff; height: fit-content; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom { display: flex; justify-content: space-between; align-items: center; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .left { display: flex; align-items: flex-end; gap: 15px; font-weight: 600; color: #494949; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .left > .sale { display: flex; align-items: center; gap: 8px; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .left > .sale > .before { display: flex; align-items: center; gap: 8px; text-decoration: line-through; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .left > .sale > .before a { height: 18px; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .left > .price { color: #6b27ff; font-weight: 600; line-height: 1.1; }
.section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .icon { opacity: 0; cursor: pointer; }
.section-tabs > .wrapper > .view > .tab > a { margin-top: 25px; }
.section-tabs > .wrapper > .view > .tab .cards > .left { background-color: #efe7ff; border-radius: 40px; padding: 32px; }
.section-tabs > .wrapper > .view > .tab .cards > .left > .top { display: flex; justify-content: space-between; align-items: center; }
.section-tabs > .wrapper > .view > .tab .cards > .left > .top > .title { font-weight: 900; }
.section-tabs > .wrapper > .view > .tab .cards > .left > button { margin-top: 30px; border: none; background-color: transparent; color: #6b27ff; font-weight: 700; display: flex; align-items: center; gap: 10px; transition: color 0.4s; }
.section-tabs > .wrapper > .view > .tab .cards > .left > button:hover { color: #9fc119; }
.section-tabs > .wrapper > .view > .tab .cards > .left > button * { transition: stroke 0.4s; }
.section-tabs > .wrapper > .view > .tab .cards > .left > button:hover * { stroke: #9fc119; }
.section-tabs > .wrapper > .view > .tab .cards > .right { background-color: #f5f5f5; border-radius: 40px; padding: 32px; }
.section-tabs > .wrapper > .view > .tab .cards > .right > .top { display: flex; justify-content: space-between; align-items: center; }
.section-tabs > .wrapper > .view > .tab .cards > .right > .top > .title { font-weight: 900; display: flex; align-items: center; padding-top: 50px; gap: 10px; }
.section-tabs > .wrapper > .view > .tab .cards > .right > p { margin-top: 40px; }
.section-tabs > .wrapper > .view > .tab .payment { width: 100%; display: flex; align-items: center; background-color: #f5f5f5; border-radius: 40px; padding: 35px 45px; gap: 24px; }
.section-tabs > .wrapper > .view > .tab .payment > h3 { display: flex; align-items: center; gap: 16px; }
.section-tabs > .wrapper > .view > .tab .payment > .variant { min-width: 200px; text-align: center; }
.section-tabs > .wrapper > .view > .tab .payment > .dot { height: 6px; width: 6px; background-color: #494949; border-radius: 9999px; flex-shrink: 0;}

.section-about-me { position: relative; margin-top: 80px; background: radial-gradient( circle, rgba(107, 39, 255, 0.15) 0%, rgba(107, 39, 255, 0) 70%); background-size: 529px 529px; background-repeat: no-repeat; background-position: center center; }
.section-about-me > .wrapper > .top { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; }
.section-about-me > .wrapper > .top > .left { display: flex; flex-direction: column; justify-content: space-between; gap: 130px; }
.section-about-me > .wrapper > .top > .left > .top > .bottom { margin-top: 30px; display: flex; align-items: center; gap: 50px; }
.section-about-me > .wrapper > .top > .left > .top > .bottom > .icon { width: 189px; height: 189px; flex-shrink: 0; border-radius: 99999px; background-color: #fff; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1); display: flex; align-items: center; justify-content: center; }
.section-about-me > .wrapper > .top > .left > .top > .bottom > .right { display: flex; flex-direction: column; gap: 24px; }
.section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .break { height: 1.2px; background-color: #49494933; }
.section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom { display: flex; gap: 24px; align-items: center; }
.section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom > .box { display: flex; gap: 12px; align-items: center; text-decoration: none; color: #000; transition: color 0.4s; }
.section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom > .box rect { transition: fill 0.4s; }
.section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom > .box:focus,
.section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom > .box:hover { color: #6b27ff; }
.section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom > .box:focus rect,
.section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom > .box:hover rect { fill: #6b27ff; }
.section-about-me > .wrapper > .top > .left > .top > .bottom > .right > h3 { font-weight: 900; color: #494949; line-height: 1.0;  }
.section-about-me > .wrapper > .top > .left > .bottom > .top { display: flex; gap: 18px 10px; flex-wrap: wrap; max-height: 190px; overflow: hidden; transition: max-height 0.7s; }
.section-about-me > .wrapper > .top > .left > .bottom > .top.tall { max-height: 700px; }

.section-about-me > .wrapper > .top > .left > .bottom > .top > .tag { color: #494949; border-radius: 9999px; padding: 14px 16px; background-color: #efe7ff; }
.section-about-me > .wrapper > .top > .left > .bottom > button { text-decoration: none; display: flex; align-items: center; gap: 8px; color: #6b27ff; font-weight: 700; margin-top: 24px; transition: color 0.4s; outline: none; border: none; background-color: transparent; }
.section-about-me > .wrapper > .top > .left > .bottom > button * { transition: stroke 0.4s; }
.section-about-me > .wrapper > .top > .left > .bottom > button:focus, 
.section-about-me > .wrapper > .top > .left > .bottom > button:hover { color: #9fc119; }
.section-about-me > .wrapper > .top > .left > .bottom > button:focus *,
.section-about-me > .wrapper > .top > .left > .bottom > button:hover * { stroke: #9fc119; }
.section-about-me > .wrapper > .bottom { margin-top: 75px; display: flex; flex-direction: column; gap: 24px; }
.section-about-me > .wrapper > .bottom > p.bold { font-weight: 600; }

.section-about-me > .wrapper > .top > .right { display: grid; }
.section-about-me > .wrapper > .top > .right > .button-wrapper { display: flex; justify-content: flex-end; padding: 40px; height: fit-content; }
.section-about-me > .wrapper > .top > .right > * { grid-area: 1 / 1; }

.section-about-me > .wrapper > .top > .right > .images { display: grid; grid-template-columns: 0.5fr 0.25fr 0.25fr; gap: 22.5px; max-height: 634px; }
.section-about-me > .wrapper > .top > .right > .images picture { display: block; width: 100%; }
.section-about-me > .wrapper > .top > .right > .images img { border-radius: 40px; width: 100%; height: 100%; object-fit: cover; }
.section-about-me > .wrapper > .top > .right > .images > .collapse { display: grid; }
.section-about-me > .wrapper > .top > .right > .images > .collapse > * { grid-area: 1 / 1; }
.section-about-me > .wrapper > .top > .right > .images > .collapse > .left { display: flex; flex-direction: column; padding: 17px 23px; background-color: #21212137; border-radius: 40px; opacity: 0; transition: opacity 0.5s; }
.section-about-me > .wrapper > .top > .right > .images > .collapse > .left.hoverable:hover { opacity: 1.0; }
.section-about-me > .wrapper > .top > .right > .images > .collapse > .left a { text-decoration: none; display: block; }
.section-about-me > .wrapper > .top > .right > .images > .collapse > .left a svg * { transition: fill 0.4s; }
.section-about-me > .wrapper > .top > .right > .images > .collapse > .left a:hover svg * { fill: #6b27ff; }

.section-about-me > .wrapper > .top > .right > .images > .collapse > .left > .top { flex-grow: 1; display: flex; align-items: center; justify-content: center; }
.section-about-me > .wrapper > .top > .right > .images > .collapse > .left > .bottom { display: flex; align-items: center; gap: 24px; }

.section-about-me > .wrapper > .top > .right > .button-wrapper > .btn-fancy-long { overflow: hidden; position: relative; display: block; max-width: max-content; background: transparent; box-shadow: none; text-decoration: none; border: none; cursor: pointer;}
.section-about-me > .wrapper > .top > .right > .button-wrapper > .btn-fancy-long .concave-filler {position: absolute; top: 50%; left: 62.8%; z-index: 2; transform: translateY(-50%); pointer-events: none; width: 35%; height: 0; background: #9FC119; border-radius: 0 250px 250px 0; transition: height .3s;}
.section-about-me > .wrapper > .top > .right > .button-wrapper > .btn-fancy-long:hover .concave-filler {height: 100%; background: #84A113;}
.section-about-me > .wrapper > .top > .right > .button-wrapper > .btn-fancy-long .btn-content {position: relative; z-index: 3; display: block; height: auto;}
.section-about-me > .wrapper > .top > .right > .button-wrapper > .btn-fancy-long .btn-content .button-svg {display: block; width: 100%; height: 100%;}
.section-about-me > .wrapper > .top > .right > .button-wrapper > .btn-fancy-long .btn-content .button-svg path {transition: fill .3s;}
.section-about-me > .wrapper > .top > .right > .button-wrapper > .btn-fancy-long:hover .btn-content .button-svg path:not(:last-child) {fill: #84A113;}
.section-about-me > .wrapper > .top > .right > .button-wrapper > .btn-fancy-long .btn-content .button-text {fill: #000; font-weight: 700;}
.section-about-me > .wrapper > .top > .right > .button-wrapper > .btn-fancy-long .btn-content .arrow-path {fill: none; stroke: #000; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;}


.section-articles .single-article {overflow: hidden; position: relative; min-height: 250px; height: 100%; padding: 32px; color: #000; text-decoration: none;}
.section-articles .single-article .fancy-bg {overflow: hidden; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 2; transform: scale(-1, -1); border-radius: 40px; clip-path: path('M0 0H130Q90 0 90 40Q90 90 50 90H32Q0 90 0 130V100000H10000V0Z'); transition: opacity .3s;}
.section-articles .single-article:hover .fancy-bg {opacity: 0.75;}
.section-articles .single-article .fancy-bg::before {content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 3; display: block; background: linear-gradient(0deg, rgba(0, 0, 0, 0.24) 100%, rgba(0, 0, 0, 0) 0%);}
.section-articles .single-article .fancy-bg .picture {display: block; width: 100%; height: 100%;}
.section-articles .single-article .fancy-bg .picture .img {transform: scale(-1, -1); display: block; width: 100%; height: 100%; object-fit: cover; object-position: center;}
.section-articles .single-article .article-title {position: relative; z-index: 5; color: #FFF; line-height: 1.2; transition: color .3s;}
.section-articles .single-article:hover .article-title {color: #9FC119;}
.section-articles .single-article .decoration-icon {position: absolute; bottom: 0; right: 0; z-index: 4; display: block;}
.section-articles .single-article:hover .decoration-icon {display: none;}
.section-articles .single-article .decoration-icon.icon-hover {display: none;}
.section-articles .single-article:hover .decoration-icon.icon-hover {display: block;}


.section-opinions { position: relative; margin-top: 100px; }
.section-opinions > .wrapper { display: flex; flex-direction: column; gap: 40px; }
.section-opinions > .wrapper > .top { background-color: #f5f5f5; border-radius: 40px; padding: 40px 0px 40px 50px; box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.15); display: flex; gap: 10px; align-items: center; position: relative; }
.section-opinions > .wrapper > .top > .icon { width: 189px; height: 189px; flex-shrink: 0; border-radius: 99999px; background-color: #fff; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1); display: flex; align-items: center; justify-content: center; margin-right: 40px; }
.section-opinions > .wrapper > .top > .middle { flex-shrink: 0; }
.section-opinions > .wrapper > .top > .middle > h3 { font-weight: 400; }
.section-opinions > .wrapper > .top > .middle > .bottom { margin-top: 24px; display: flex; gap: 24px; align-items: stretch; }
.section-opinions > .wrapper > .top > .middle > .bottom > .rating { display: flex; flex-shrink: 0; gap: 24px; padding: 16px 32px; background-color: #ffffff1a; border-radius: 999px; color: #494949; box-shadow: inset 0px 0px 10px 4px rgba(0, 0, 0, 0.05); }
.section-opinions > .wrapper > .top > .middle > .bottom > .rating > .stars { display: flex; gap: 12px; align-items: center; }
.section-opinions > .wrapper > .top > .middle > .bottom > .rating > .stars > svg { width: 40px; height: 40px; }
.section-opinions > .wrapper > .top > .middle > .bottom > .opinions { padding: 0px 32px; height: auto; display: flex; align-items: center; color: #494949; background-color: #efe7ff; border-radius: 999px; }
.section-opinions > .wrapper > .top > .middle > .bottom > .global-btn-white { padding: 17px 65px; }

.section-opinions > .wrapper > .top > .pfp { margin-top: -185px; background-color: #fff; border-radius: 99999px; z-index: 999; border: 1.8px solid #f5f5f5; margin-left: auto; flex-shrink: 1; height: auto; }
.section-opinions > .wrapper > .top > .pfp img { border-radius: 9999px; width: 100%; height: auto; }

.section-opinions > .wrapper > .top > .decor { position: absolute; right: 280px; top: -158px; }
.section-opinions > .wrapper > .top > .decor-2 { position: absolute; right: -307px; top: -129px; z-index: 999; }


.section-opinions > .wrapper > .list { display: flex; gap: 32px; flex-direction: column; }
.section-opinions > .wrapper > .list > .item { display: grid; grid-template-columns: 423px 1fr; gap: 40px; }
.section-opinions > .wrapper > .list > .item > .right { display: flex; flex-direction: column; gap: 18px; justify-content: center; }
.section-opinions > .wrapper > .list > .item > .right > .quote { padding-left: 40px; border-left: 1px solid #000; }
.section-opinions > .wrapper > .list > .item > .right > .response { margin-left: 40px; border-radius: 16px; background-color: #f5f5f5; padding: 14px 20px; color: #494949;}
.section-opinions > .wrapper > .list > .item > .right > .response > .title { color: #49494980;}

.section-opinions > .wrapper > .list > .item > .left { display: grid; }
.section-opinions > .wrapper > .list > .item > .left > * { grid-area: 1 / 1; }
.section-opinions > .wrapper > .list > .item > .left > .bubble { background-color: #f5f5f5; clip-path: path('M0 40C0 17.9086 17.9086 0 40 0H383C405.091 0 423 17.9086 423 40V114C423 136.091 405.091 154 383 154H251.035C235.552 154 223 141.448 223 125.965C223 110.482 210.448 97.9304 194.965 97.9304H40C17.9086 97.9304 0 80.0218 0 57.9304V40Z'); height: 154px; display: flex; flex-direction: column; align-items: flex-end; padding: 24px 24px 20px 32px; gap: 21px; }
.section-opinions > .wrapper > .list > .item > .left > .bubble > .top { width: 100%; display: flex; gap: 24px;  }
.section-opinions > .wrapper > .list > .item > .left > .bubble > .top > svg { flex-shrink: 0; }
.section-opinions > .wrapper > .list > .item > .left > .bubble > .top > .right > .date { margin-top: 2px; font-weight: 900; }

.section-opinions > .wrapper > .list > .item > .left > .stars { display: flex; height: 154px; align-items: flex-end; padding: 16px 39px; gap: 8px; }
/* .section-opinions > .wrapper > .list > .item > .left > .stars[data-rating="4"] > svg:nth-child(5) > path,
.section-opinions > .wrapper > .list > .item > .left > .stars[data-rating="3"] > svg:nth-child(5) > path,
.section-opinions > .wrapper > .list > .item > .left > .stars[data-rating="2"] > svg:nth-child(5) > path,
.section-opinions > .wrapper > .list > .item > .left > .stars[data-rating="1"] > svg:nth-child(5) > path { fill: #efe7ff; }
.section-opinions > .wrapper > .list > .item > .left > .stars[data-rating="3"] > svg:nth-child(4) > path,
.section-opinions > .wrapper > .list > .item > .left > .stars[data-rating="2"] > svg:nth-child(4) > path,
.section-opinions > .wrapper > .list > .item > .left > .stars[data-rating="1"] > svg:nth-child(4) > path { fill: #efe7ff; }
.section-opinions > .wrapper > .list > .item > .left > .stars[data-rating="2"] > svg:nth-child(3) > path,
.section-opinions > .wrapper > .list > .item > .left > .stars[data-rating="1"] > svg:nth-child(3) > path { fill: #efe7ff; }
.section-opinions > .wrapper > .list > .item > .left > .stars[data-rating="1"] > svg:nth-child(2) > path { fill: #efe7ff; } */

.section-opinions > .wrapper > button { align-self: center; }

.popup-opinion > .subtitle > span { color: #6b27ff; font-weight: 700; }
.popup-opinion > .rating { margin-top: 8px; display: grid; grid-template-columns: 130px 1fr; gap: 12px 24px; align-items: center; }
.popup-opinion > .rating > .name { font-weight: 700; }
.popup-opinion > .rating > .picker { display: flex; gap: 8px; flex-direction: row-reverse; justify-content: flex-end; }
.popup-opinion > .rating > .picker > svg { cursor: pointer; }
.popup-opinion > .rating > .picker > svg > path { fill: #c1c1c1; transition: fill 0.4s; }
.popup-opinion > .rating > .picker[data-value="5"] > svg > path { fill: #6b27ff; }
.popup-opinion > .rating > .picker[data-value="4"] > svg:nth-child(1) ~ svg > path { fill: #6b27ff; }
.popup-opinion > .rating > .picker[data-value="3"] > svg:nth-child(2) ~ svg > path { fill: #6b27ff; }
.popup-opinion > .rating > .picker[data-value="2"] > svg:nth-child(3) ~ svg > path { fill: #6b27ff; }
.popup-opinion > .rating > .picker[data-value="1"] > svg:nth-child(4) ~ svg > path { fill: #6b27ff; }
.popup-opinion > .rating > .picker:hover > svg > path { fill: #c1c1c1 !important; }
.popup-opinion > .rating > .picker > svg:hover ~ svg > path { fill: #6b27ff !important; }
.popup-opinion > .rating > .picker > svg:hover > path { fill: #6b27ff !important; }
.popup-opinion > textarea { background-color: #fff; border: 1px solid #494949; border-radius: 24px; resize: none; padding: 24px; color: #494949; position: relative; }
.popup-opinion > textarea::placeholder { color: #494949; }
.popup-opinion > textarea::-webkit-scrollbar-track { margin: 15px 0px; }
.popup-opinion > .txa-icon { margin-top: -80px; z-index: 999; align-self: flex-end; margin-right: 24px; margin-bottom: 24px; pointer-events: none; }
.popup-opinion > .global-input-group input { background-color: #fff; border: 1px solid #494949; }
.popup-opinion > .global-input-group input::placeholder { color: #494949; }
.popup-opinion > .global-input-group.invalid input { border-color: #ed7474; }



.popup-working-hours > .timetable { display: grid; grid-template-columns: 110px 1fr 130px; gap: 20px 16px; align-items: center; color: #000 } 
.popup-working-hours > .timetable > .day { text-align: right; } 
.popup-working-hours > .timetable > .hours { font-weight: 700; } 
.popup-working-hours > .timetable > .break { width: 100%; height: 1px; background-color: #dbdbdb; position: relative; } 
.popup-working-hours > .timetable > .break::before { content: ""; display: block; width: 5px; height: 5px; background-color: inherit; border-radius: 9999px; position: absolute; left: 0px; top: -2px;} 
.popup-working-hours > .timetable > .break::after { content: ""; display: block; width: 5px; height: 5px; background-color: inherit; border-radius: 9999px; position: absolute; right: 0px; top: -2px;} 



.popup-contact > .content { display: flex; flex-direction: column; gap: 24px; margin-top: 20px; color: #000; margin-bottom: 80px; } 
.popup-contact > .content > .break { width: 100%; height: 1.2px; background-color: #49494933; } 
.popup-contact > .content > .row { display: flex; gap: 24px; align-items: center; }
.popup-contact > .content > .row > a { display: flex; gap: 12px; align-items: center; text-decoration: none; color: #000; transition: color 0.4s; }
.popup-contact > .content > .row > a:hover { color: #6b27ff; }
.popup-contact > .content > .row > a > svg { width: 40px; height: 40px; }
.popup-contact > .content > .row > a:hover > svg * { transition: fill 0.4s; }
.popup-contact > .content > .row:first-child > a:hover > svg path { fill: #6b27ff; }
.popup-contact > .content > .row:last-child > a:hover > svg rect { fill: #6b27ff; }
.popup-contact > .content > .title { font-weight: 900; color: #494949; margin-bottom: -10px; }

.popup-map > .map { height: 360px; border-radius: 40px; overflow: hidden; border: 1px solid #6b27ff; }

.popup-booking > .subtitle > span { color: #6b27ff; font-weight: 700; }
.popup-booking > .box { display: grid; grid-template-columns: 32px 1fr; gap: 16px; padding-right: 38px; }
.popup-booking > .box > .left { font-weight: 900; color: #6b27ff; }
.popup-booking > .box > .right { display: flex; flex-direction: column; gap: 6px; }
.popup-booking > .box > .right > label { font-weight: 600; }
.popup-booking > .box .ts-dropdown { overflow: hidden; border-radius: 24px; }
.popup-booking > .box .ts-control { border-radius: 999px; border: 1px solid #494949; padding: 16px 24px; outline: none; }
.popup-booking > .box .ts-control::after { content: ""; display: block; position: absolute; right: 24px; width: 24px; height: 24px; background: url("data:image/svg+xml,%3Csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M17.7142%209L11.7142%2015L5.71423%209'%20stroke='%23494949'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain; }
.popup-booking > .box .ts-control .item { font-size: 20px; line-height: 120%; height: 24px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; max-width: 380px; }
.popup-booking > .box .ts-control input { font-size: 20px; color: #494949; font-family: 'DM Sans', sans-serif; }
.popup-booking > .box .ts-control input::placeholder { color: #494949; }
.popup-booking > .box .ts-dropdown { border-radius: 24px; border: 1px solid #494949; }
.popup-booking > .box .ts-dropdown-content { max-height: 265px; }
.popup-booking > .box .ts-dropdown-content::-webkit-scrollbar-track { margin: 20px 0px; }
.popup-booking > .box .ts-dropdown-content .option { padding: 10px 14px; font-size: 16px; font-family: 'DM Sans', sans-serif; color: #494949; }
.popup-booking > .box .ts-dropdown-content .option:hover { background-color: #efe7ff; color: #6b27ff; }
.popup-booking > .box .ts-dropdown-content .option.active { background-color: #efe7ff; }
.popup-booking > .box > .right > .booking > .top { display: flex; justify-content: space-between; align-items: center; background-color: #efe7ff; border-radius: 24px; padding: 10px; }
.popup-booking > .box > .right > .booking > .top > button { border: none; background-color: transparent; outline: none; display: flex; align-items: center; }
.popup-booking > .box > .right > .booking > .top > button rect { transition: fill 0.8s; }
.popup-booking > .box > .right > .booking > .top > button svg > * { transition: fill 0.4s; }
.popup-booking > .box > .right > .booking > .top > button:hover rect { fill: #6b27ff; }
.popup-booking > .box > .right > .booking > .top > button:hover path { stroke: #fff; }
.popup-booking > .box > .right > .booking > .top > button:last-child { rotate: 180deg; }
.popup-booking > .box > .right > .booking > .picker { margin-top: 12px; }
.popup-booking > .box > .right > .booking > .picker > .unavailable { display: flex; justify-content: center; align-items: center; gap: 12px; background-color: #fff; border-radius: 24px; padding: 18px 46px; }
.popup-booking > .box > .right > .booking > .picker > .unavailable > svg { flex-shrink: 0; }
.popup-booking > .box > .right > .booking > .picker > .frames { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } 
.popup-booking > .box > .right > .booking > .picker > .frames label { border: 1px solid #494949; padding: 18px 0px; text-align: center; border-radius: 999px; font-weight: 500; cursor: pointer; } 
.popup-booking > .box > .right > .booking > .picker > .frames label:has(input[type="radio"]:checked) { border: 1px solid #6b27ff; background-color: #fff; color: #6b27ff; } 
.popup-booking > .notice { display: flex; gap: 8px; padding: 0px 23px; }
.popup-booking > .notice > svg { margin-top: 4px; flex-shrink: 0; }
.popup-booking .btn-fancy-long { margin-top: 40px; overflow: hidden; position: relative; display: block; max-width: max-content; background: transparent; box-shadow: none; text-decoration: none; border: none; cursor: pointer;}
.popup-booking .btn-fancy-long .concave-filler {position: absolute; top: 50%; left: 64%; z-index: 2; transform: translateY(-50%); pointer-events: none; width: 35%; height: 0; background: #9FC119; border-radius: 0 250px 250px 0; transition: height .3s;}
.popup-booking .btn-fancy-long:hover .concave-filler {height: 100%; background: #84A113;}
.popup-booking .btn-fancy-long .btn-content {position: relative; z-index: 3; display: block; height: auto;}
.popup-booking .btn-fancy-long .btn-content .button-svg {display: block; width: 100%; height: 100%;}
.popup-booking .btn-fancy-long .btn-content .button-svg path {transition: fill .3s;}
.popup-booking .btn-fancy-long:hover .btn-content .button-svg path.fill {fill: #84A113;}
.popup-booking .btn-fancy-long .btn-content .button-text {fill: #000; font-weight: 700;}
.popup-booking .btn-fancy-long .btn-content .arrow-path {fill: none; stroke: #000; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;}

.popup-verify-opinion .otp { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; max-width: 350px; margin-top: 10px; }
.popup-verify-opinion label { padding-left: 0px; }
.popup-verify-opinion .otp > input { border-radius: 16px; background-color: #fff; border: 1px solid #494949; padding: 22px 16px; color: #494949; text-align: center; }
.popup-verify-opinion .otp > input::placeholder { color: #494949; }

.popup-opinion-thanks .subtitle.top { font-weight: 700; }
.popup-opinion-thanks .subtitle.bottom { margin-bottom: 130px; }


.diet-card {overflow: visible; position: relative; display: flex; flex: 1; flex-direction: column; gap: 8px; height: 100%;} .section-discounts > .wrapper > .bottom > .diets > .single-slide .box-link {position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 6; display: block; border-radius: 40px;}
.diet-card .img-box {overflow: hidden; position: relative; width: 100%; height: 214px; border-radius: 40px 40px 0 0;}
.diet-card .img-box::before {content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 3; display: block; width: 100%; height: 100%;background: linear-gradient(0deg, rgba(107, 107, 107, 0.24) 0%, rgba(107, 107, 107, 0) 100%);}
.diet-card .img-box .picture {display: block; width: 100%; height: 100%;}
.diet-card .img-box .img {position: relative; z-index: 2; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center;}
.diet-card .img-box .img {object-position: top;}
.diet-card .img-box .decoration-icon {position: absolute; top: 24px; right: 24px; z-index: 4; display: block; width: 64px; height: auto;}
.diet-card .img-box .decoration-icon rect {transition: fill .3s;}
.diet-card:hover .img-box .decoration-icon rect {fill: #9FC119;}
.diet-card .img-box .decoration-icon path {transition: fill .3s;}
.diet-card:hover .img-box .decoration-icon path {fill: #000;}
.diet-card .img-box .floating-badge {position: absolute; bottom: 24px; right: 24px; z-index: 4; display: block; width: 120px; height: auto;}
.diet-card .img-box .floating-badge circle {transition: fill .3s;}
.diet-card:hover .img-box .floating-badge circle {fill: #9FC119;}
.diet-card .img-box .floating-badge path {transition: fill .3s;}
.diet-card:hover .img-box .floating-badge path {fill: #000;}
.diet-card .img-box .floating-elements-box {position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 5; display: flex; flex-direction: column; gap: 24px; padding: 24px;}
.diet-card .img-box .floating-elements-box .single-element {width: 100%; max-width: max-content; padding: 8px 16px; border-radius: 250px; transition: background-color .3s, color .3s;}
.diet-card .img-box .floating-elements-box .single-element.element-top {margin-bottom: auto; font-weight: 700; text-transform: uppercase;}
.diet-card .img-box .floating-elements-box .single-element.element-bottom {margin-top: auto;}
.diet-card .img-box .floating-elements-box .single-element.bg-purple {background-color: #6B27FF; color: #FFF;}
.diet-card .img-box .floating-elements-box .single-element.bg-white {background-color: #FFF; color: #6B27FF;}
.diet-card:hover .img-box .floating-elements-box .single-element.single-element {background-color: #9FC119; color: #000;}
.diet-card .img-box .floating-elements-box .single-element.global-opinion-box {padding: 7px 12px 5px 12px;}
.diet-card:hover .img-box .floating-elements-box .single-element.global-opinion-box {background-color: rgba(159, 193, 25, 0.25);}
.diet-card:hover .img-box .floating-elements-box .single-element.global-opinion-box .opinion-star path {fill: #9FC119 !important;}
.diet-card .content-box {display: flex; flex: 1; flex-direction: column; justify-content: space-between; gap: 8px; padding: 24px; background-color: #F5F5F5; border-radius: 0 0 40px 40px;}
.diet-card .content-box .info-top {display: grid; grid-template-columns: 1fr max-content; gap: 16px;}
.diet-card .content-box .info-top .icon {display: block; flex-shrink: 0; width: 100%; max-width: 64px; height: auto; opacity: 0; transition: opacity .3s;}
.diet-card:hover .content-box .info-top .icon {opacity: 1;}
.diet-card .content-box .info-top .info-name {display: flex; flex-direction: column; gap: 4px;}
.diet-card .content-box .info-top .info-name .name-label { font-weight: 900; text-transform: uppercase;}
.diet-card .content-box .info-top .info-name .name-text { color: #494949; font-weight: 400; line-height: 1.2;}
.diet-card .content-box .info-top .btn-add-to-basket {position: relative; z-index: 7; display: block; text-decoration: none;}
.diet-card .content-box .info-bottom {display: flex; align-items: flex-end; justify-content: space-between; gap: 16px;}
.diet-card .content-box .info-bottom .additional-info {line-height: 1.2;}
.diet-card .content-box .info-bottom .price-box {display: flex; flex-direction: column; gap: 8px;}
.diet-card .content-box .info-bottom .price-box .price-current {color: #6B27FF; font-weight: 600; line-height: 1; transition: color .3s;}
.diet-card:hover .content-box .info-bottom .price-box .price-current {color: #9FC119;}
.diet-card .content-box .info-bottom .price-box .price-info {display: flex; flex-direction: column; gap: 2px; color: #494949; font-weight: 600;}
.diet-card .content-box .info-bottom .price-box .price-info .info-label {font-size: 12px; line-height: 1;}
.diet-card .content-box .info-bottom .price-box .price-info .info-details {display: flex; align-items: center; gap: 4px;}
.diet-card .content-box .info-bottom .price-box .price-info .info-details .tooltip-wrapper {z-index: 7;}
.diet-card .content-box .info-bottom .price-box .price-info .info-details .tooltip-wrapper .tooltip-icon {width: 16px;}
.diet-card .content-box .info-bottom .price-box .price-info .info-details .details-text {text-decoration: line-through; line-height: 1;}
.diet-card .content-box .info-bottom .decoration-icon {display: block; flex-shrink: 0; width: 54px; height: auto; margin-left: auto; opacity: 0; transition: opacity .3s;}
.diet-card:hover .content-box .info-bottom .decoration-icon {opacity: 1;}
.diet-card .box-link { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 6; display: block; border-radius: 40px; }

.popup-filters { padding: 24px 0px; background-color: #f5f5f5; border-radius: 40px; box-shadow: 0px 1px 8px 0 #2121211f; width: 600px; color: #494949; display: flex; flex-direction: column; gap: 20px; }
.popup-filters > .top { overflow: scroll; flex-shrink: 0; display: flex; flex-direction: column; gap: 20px; max-height: calc(100vh - 300px) }
.popup-filters > .top > .title { padding: 0px 24px; display: flex; justify-content: space-between; align-items: center; }
.popup-filters > .top > .title > .btn-close { cursor: pointer; }
.popup-filters > .top > .title > .btn-close > svg * { transition: stroke 0.3s; }
.popup-filters > .top > .title > .btn-close:hover svg * { stroke: #6b27ff; }
.popup-filters > .top > .title > h5 { font-weight: 900; display: flex; align-items: center; gap: 16px; position: relative; }
.popup-filters > .top > .title > h5 > .badge { width: 28px; height: 28px; border-radius: 9999px; background-color: #6b27ff; color: #fff; font-weight: 400; display: flex; justify-content: center; align-items: center; }
.popup-filters > .top > .diets { padding: 0px 24px; display: flex; justify-content: flex-start; align-items: center; gap: 10px; flex-wrap: wrap; overflow: hidden; max-height: 140px; transition: max-height 0.5s ease-in-out; padding-bottom: 20px; flex-shrink: 0; }
.popup-filters > .top > .diets.full { max-height: 999px; }
.popup-filters > .top > .diets > label { display: block; padding: 13px 16px; border-radius: 9999px; font-weight: 500; cursor: pointer; background-color: #efe7ff; color: #6b27ff; transition: background-color 0.3s, color 0.3s; }
.popup-filters > .top > .diets > label:hover { background-color: #6b27ff; color: #f5f5f5; }
.popup-filters > .top > .diets > label > input { position: absolute; }
.popup-filters > .top > .diets > label:has(input:checked) { background-color: #6b27ff; color: #f5f5f5; }
.popup-filters > .top > .btn-show-diets { padding: 12px 0px; display: flex; justify-content: center; align-items: center; gap: 12px; font-weight: 500; cursor: pointer; box-shadow: 0px -16px 20px 0px rgba(0, 0, 0, 0.1); margin-top: -20px; border-bottom: 1px solid #49494933; transition: color 0.3s; background-color: #f5f5f5; }
.popup-filters > .top > .btn-show-diets:hover { color: #6b27ff; }
.popup-filters > .top > .btn-show-diets * { transition: fill 0.3s; }
.popup-filters > .top > .btn-show-diets:hover * { fill: #6b27ff; }
.popup-filters > .top > .break { height: 1px; background-color: #49494933; }
.popup-filters > .top > .title > h5 > .tooltip:hover::before { content: var(--before-content, ''); display: block; min-width: 200px; background-color: #fff; position: absolute; bottom: 30px; border-radius: 10px; border: 1px solid #494949; padding: 4px 8px; font-size: 12px; font-weight: 400; }
.popup-filters > .top > .types { padding: 0px 24px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.popup-filters > .top > .types > label { display: block; padding: 13px 16px; border: 1px solid #494949; border-radius: 9999px; font-weight: 500; cursor: pointer; transition: border-color, color 0.3s; }
.popup-filters > .top > .types > label:hover { border-color: #6b27ff; color: #6b27ff; }
.popup-filters > .top > .types > label > input { position: absolute; }
.popup-filters > .top > .types > label:has(input:checked) { border-color: #6b27ff; color: #6b27ff; }
.popup-filters > .top > .ranges { padding: 0px 24px; display: flex; flex-direction: column; gap: 24px; }
.popup-filters > .top > .ranges > .inputs { display: flex; justify-content: space-between; }
.popup-filters > .top > .ranges > .inputs > label { display: flex; flex-direction: column; gap: 6px; font-weight: 600; }
.popup-filters > .top > .ranges > .inputs > label > input { background-color: transparent; border: 1px solid #494949; width: 128px; padding: 15px 0px; text-align: center; color: #494949; border-radius: 999px; -webkit-appearance: none; margin: 0; }
.popup-filters > .top > .ranges .noUi-target { background: #EFE7FF !important; border-radius: 999px !important;  border: none !important; box-shadow: none !important; }
.popup-filters > .top > .ranges .noUi-horizontal { height: 2px !important; }
.popup-filters > .top > .ranges .noUi-connect { background-color: #6B27FF !important; }
.popup-filters > .top > .ranges .noUi-handle { background: #6b27ff !important; border: 4px solid #fff !important; border-radius: 999px !important; box-shadow: none !important; cursor: grab; width: 25px !important; height: 25px !important; top: -11px !important; }
.popup-filters > .top > .ranges .noUi-handle::before,
.popup-filters > .top > .ranges .noUi-handle::after { display: none !important; }
.popup-filters > .top > .ranges .noUi-handle:active { cursor: grabbing; border-color: #6B27FF !important; }
.popup-filters > .clear { text-align: center; text-decoration: none; font-weight: 500; color: #ed7474; padding: 15px 0px 0px 0px; transition: color 0.3s; display: flex; align-items: center; justify-content: center; gap: 8px; }
.popup-filters > .clear:hover { color: #a15f5f; }
.popup-filters > .clear * { transition: fill 0.3s; }
.popup-filters > .clear:hover * { fill: #a15f5f; }
.popup-filters > .button { padding: 0px 24px; }
.popup-filters > .button > .global-btn-white { padding: 18px 0px; max-width: 100%; width: 100%; }

@media all and (max-width: 1600px) {
    .section-opinions > .wrapper > .top > .decor-2 { display: none; }
    .section-hero > .bottom { gap: 60px; }
    .section-hero > .decor { display: none; }
}

@media all and (max-width: 1500px) {

    .section-hero > .top > .left { grid-template-columns: 1fr; }
    .section-hero > .top > .left > .right { gap: 20px; }
    .section-hero > .top > .left > .right > .bubble:first-child { align-self: flex-start; }
    .section-hero > .bottom { margin-top: 30px; }
    .section-hero > .bottom > .box img { width: 100px; height: auto; margin-right: 18px; }

    .section-hero > .top > .right { padding-right: 150px; }
    .section-hero > .top > .right > .left > img { position: relative; z-index: 9;}

    .section-about-me > .wrapper > .top { gap: 40px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom { gap: 25px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .icon { width: 150px; height: 150px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .icon > svg { height: 100px; width: auto;}
    .section-about-me > .wrapper > .top > .left { justify-content: flex-start; gap: 70px; }

    .section-opinions > .wrapper > .top > .pfp { display: none; }
    .section-opinions > .wrapper > .top > .decor { right: 0px; }

    .section-tabs > .decor-2 { display: none; } 
}

@media all and (max-width: 1400px) {
    .section-hero > .top > .right { padding-right: 100px; }

    .section-tabs > .wrapper > .view > .tab .cards > .left { padding: 24px; }
    .section-tabs > .wrapper > .view > .tab .cards > .right { padding: 24px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card { padding: 24px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card .icon { width: 65px; height: 65px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card .icon > svg { width: 30px; height: 30px;}
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .icon { width: 65px; height: 65px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .icon > svg { width: 30px; height: 30px;}
    .section-tabs > .wrapper > .view > .tab .payment > .variant { min-width: 150px; }

    .section-opinions > .wrapper > .top > .middle > .bottom { flex-wrap: wrap; }
}


@media all and (max-width: 1300px) {

    .section-hero > .top > .right { padding-right: 50px; }
    .section-hero > .top { grid-template-columns: 1fr 1fr;}

    .section-products > .wrapper > .products { grid-template-columns: 1fr 1fr 1fr;}

    .section-tabs > .wrapper > .view > .tab .cards > .card { gap: 24px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .left > .sale { flex-direction: column; align-items: flex-start; gap: 0px; }

    .section-about-me > .wrapper > .top > .left { gap: 65px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .right { gap: 16px; }
    .section-about-me > .wrapper > .top > .right > .images { gap: 10px; }
    .section-about-me > .wrapper > .top > .right > .images > .collapse > .left > .bottom { gap: 12px; }
    .section-about-me > .wrapper > .top > .left { gap: 50px; }
    .section-about-me > .wrapper > .top { grid-template-columns: 1.5fr 1fr }
    .section-about-me > .wrapper > .bottom { margin-top: 40px; }

    .section-opinions > .wrapper > .top { padding: 24px; }
}

@media all and (max-width: 1200px) {

    .section-hero > .top > .right { padding-right: 0px; }
    .section-hero > .middle > .inner > picture { display: none; }
    .section-hero > .middle > .inner > .products { margin-top: 20px; }
    .section-hero > .bottom > .box img { width: 80px; margin-right: 14px; }

    .section-tabs > .wrapper > .tabs { width: 100%; }
    .section-tabs > .wrapper > .tabs > .opt { min-width: 0px; width: 100%; }
    .section-tabs > .wrapper > .view > .tab .cards > .card .icon { width: 60px; height: 60px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .icon { width: 60px; height: 60px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top { gap: 10px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top > .badge { padding: 8px 16px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top > h3 { font-size: 18px; line-height: 1.1; }

    .section-opinions > .wrapper > .top > .decor img { width: 250px; height: auto; }
    .section-opinions > .wrapper > .top > .decor { top: -90px; right: 0px; }
    .section-opinions > .wrapper > .top > .middle { flex-shrink: 1; }
    .section-opinions > .wrapper > .top > .middle > .bottom { flex-wrap: wrap; }
    .section-opinions > .wrapper > .top > .middle > .bottom > .rating > .stars > svg { width: 30px; height: 30px; }

}

@media all and (max-width: 1100px) {
    .section-hero > .bottom { gap: 34px; }
    .section-hero > .middle > .inner > .products { grid-template-columns: 1fr 1fr; }
    .section-hero > .middle > .inner > .products > .product:last-child { display: none; }

    .section-hero > .bottom { justify-content: flex-start; gap: 30px; }

    .section-tabs > .wrapper > .view > .tab .payment > .variant { min-width: 110px; }

    .section-about-me > .wrapper > .top { grid-template-columns: 2fr 1fr; }
    .section-about-me > .wrapper > .top > .right > .images { grid-template-columns: 0.66fr 0.33fr;}
    .section-about-me > .wrapper > .top > .right > .images picture:last-child { display: none; }

    .section-opinions > .wrapper > .top > .decor { display: none; }
}

@media all and (max-width: 1000px) {

    .section-hero > .bottom { flex-wrap: wrap; gap: 16px 12px; }
    .section-hero > .bottom > .label { display: block; font-weight: 900; color: #494949; width: 100%; margin-bottom: 10px; }
    .section-hero > .bottom > .box { padding: 18px 30px; border-radius: 40px; background-color: #efe7ff; }
    .section-hero > .bottom > .box > picture { display: none; }

    .section-products > .wrapper > .products { grid-template-columns: 1fr 1fr;}
    .diet-card .content-box .info-top .icon { opacity: 1.0 }

    .section-tabs > .wrapper > .view > .tab.active { gap: 16px; }
    .section-tabs > .wrapper > .view > .tab .cards { gap: 16px; }
    .section-tabs > .wrapper > .view > .tab .payment { padding: 25px 35px; }
    .section-tabs > .wrapper > .view > .tab .cards > .left { padding: 18px; border-radius: 30px; }
    .section-tabs > .wrapper > .view > .tab .cards > .right { padding: 18px; border-radius: 30px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card { padding: 18px; border-radius: 30px; }
    .section-tabs > .wrapper > .view > .tab .cards > .left > .top { flex-direction: column; align-items: flex-start; gap: 16px; }
    .section-tabs > .wrapper > .view > .tab .cards > .right > .top { flex-direction: column; align-items: flex-start; gap: 16px; }
    .section-tabs > .wrapper > .view > .tab .cards > .right > .top > .title { padding-top: 0px; height: 52px; }
    .section-tabs > .wrapper > .view > .tab .cards > .left > button { margin-top: 24px; }
    .section-tabs > .wrapper > .view > .tab .cards > .right > p { margin-top: 24px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card { flex-grow: 1; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right { width: 100%; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top > .badge { position: absolute; top: -10px; right: -10px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top > h3 { width: 100%; height: fit-content; margin-top: 10px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .left > .price { font-size: 22px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .left > .sale { font-size: 14px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .icon { opacity: 1; background-color: #9fc119; }

    .section-about-me > .wrapper > .top { grid-template-columns: 1fr; }
    .section-about-me > .wrapper > .top > .left { gap: 30px; }
    .section-about-me > .wrapper > .top > .right > .images { grid-template-columns: 0.5fr 0.25fr 0.25fr;}
    .section-about-me > .wrapper > .top > .right > .images picture:last-child { display: block; }
    .section-about-me > .wrapper > .top > .right > .images picture { height: 600px; }
    .section-about-me > .wrapper > .bottom { margin-top: 20px; }
}

@media all and (max-width: 900px) {

    .section-hero > .top { grid-template-columns: 0.596fr 0.403fr; }
    .section-hero > .middle > .inner { margin-top: 30px; }

    .section-tabs > .wrapper > .view > .tab .payment > .variant { min-width: 0px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card { flex-direction: column; gap: 10px; }
    .section-tabs > .wrapper > .tabs { padding: 12px; }
    .section-tabs > .wrapper > .tabs { gap: 10px; }
    .section-tabs > .wrapper > .tabs > .opt { gap: 8px; padding: 8px; }
    .section-tabs > .wrapper > .tabs > .opt > svg { width: 24px; height: 24px; }
    .section-tabs > .wrapper > .tabs > .opt > .right > h3 { line-height: 1; }

    .section-opinions > .wrapper > .list { align-items: center; }
    .section-opinions > .wrapper > .list > .item { grid-template-columns: 1fr; width: 423px; gap: 16px; }
    .section-opinions > .wrapper > .list > .item > .right > .quote { padding: 16px; border: none; }
    .section-opinions > .wrapper > .list > .item > .right > .response { margin: 0px; }
}

@media all and (max-width: 767px) {

    .section-hero > .top { grid-template-columns: 1fr; }

    .section-hero > .top > .right { order: -1; justify-content: center; border: 2px solid #efe7ff; border-radius: 40px; width: 100%; margin-bottom: 20px; padding: 50px 70px 0px 70px; }
    .section-hero > .top > .right > .left { margin-bottom: -5px; }

    .section-hero > .top > .right > .right { display: none; }
    .section-hero > .top > .left > .left > h1 { width: calc(100vw - 200px); }
    .section-hero > .middle > .inner > .products { grid-template-columns: 1fr; }
    .section-hero > .middle > .inner > .products > .product:last-child { display: flex; }

    .section-products > .wrapper > .top { flex-direction: column; gap: 24px; }
    .section-products > .wrapper > .top > button { width: 100%; }

    .section-tabs > .decor { display: none; }
    .section-tabs > .wrapper > .tabs > .opt > .right { font-size: 12px; }
    .section-tabs > .wrapper > .tabs > .opt > .right > h3 { font-size: 14px; }
    .section-tabs > .wrapper > .view > .tab .cards { grid-template-columns: 1fr;}
    .section-tabs > .wrapper > .view > .tab .cards > .left > .top { flex-direction: row; align-items: center; }
    .section-tabs > .wrapper > .view > .tab .cards > .right > .top { flex-direction: row; align-items: center; }
    .section-tabs > .wrapper > .view > .tab .payment { padding: 18px 20px; gap: 20px; }
    .section-tabs > .wrapper > .view > .tab .payment > h3 > span { display: none; }
    .section-tabs > .wrapper > .view > .tab .cards > .card { flex-direction: row; gap: 20px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top > h3 { width: 80%; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top > .badge { position: inherit; }


    .section-about-me { background: none; }
    .section-about-me > .wrapper > .top > .right > .images picture { height: 500px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .icon { width: 120px; height: 120px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .icon > svg { height: 80px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .right { gap: 12px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom { gap: 12px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom > .box { gap: 8px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom > .box > svg { width: 30px; height: 30px; }
    .section-about-me > .wrapper > .top > .left > .bottom > .top > .tag { padding: 7px 9px; }
    .section-about-me > .wrapper > .top > .left > .bottom > .top { gap: 10px; max-height: 90px; }
    .section-about-me > .wrapper > .top > .left > .bottom > button { margin-top: 12px; }

    .section-opinions > .wrapper > .top { flex-direction: column; }
    .section-opinions > .wrapper > .top > .icon { margin-right: 0px; }
    .section-opinions > .wrapper > .top > .middle > h3 { text-align: center; }
    .section-opinions > .wrapper > .top > .middle > .bottom { justify-content: center; }


    .popup { width: 100%; padding: 14px; }
    .popup > .wrapper { width: 100%; }

    .popup-booking > .box .ts-control .item { max-width: 0px; width: 100%; min-width: 80%; font-size: 16px; height: 20px; }
    .popup-booking > .box { gap: 0px; padding-right: 32px; }
    .popup-booking > .box > .right > .booking > .picker > .unavailable { padding: 12px 20px; }


    .popup-contact > .content > .wide { flex-direction: column; align-items: flex-start; gap: 12px; }

    .section-products > .wrapper > button { margin-top: 0px; }
    .section-tabs > .wrapper > .view > .tab > a { margin-top: 16px; }
    .section-about-me { margin-top: 50px; }

    .popup-filters { gap: 12px; }
    .popup-filters > .top { gap: 12px; }
    .popup-filters > .top > .diets > label { font-size: 14px; }
    .popup-filters > .top > .title > h5 > .tooltip:hover::before { right: -50%; }
    .popup-filters > .top > .title > .btn-close > svg { width: 30px; height: 30px; }
}

@media all and (max-width: 680px) {
    .section-products > .wrapper > .products { grid-template-columns: 1fr;}
}

@media all and (max-width: 576px) {

    .section-tabs > .wrapper > .tabs > .opt > svg { display: none; }
    .section-tabs > .wrapper > .view > .tab .payment { flex-direction: row; flex-wrap: wrap; gap: 10px 20px; border-radius: 30px; }
    .section-tabs > .wrapper > .view > .tab .payment > h3 > span { display: block; }
    .section-tabs > .wrapper > .view > .tab .payment > .dot { display: none; }

    .section-about-me > .wrapper > .top > .left > .top > .bottom { flex-direction: column; align-items: center; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .right { text-align: center; width: 100%; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom { justify-content: center; gap: 20px; }
    .section-about-me > .wrapper > .top > .right > .images picture { height: 400px; }
    .section-about-me > .wrapper > .top > .left > .bottom > .top { justify-content: center; }
    .section-about-me > .wrapper > .top > .left > .bottom { display: flex; flex-direction: column; align-items: center; }
    .section-about-me > .wrapper > .top > .left > .bottom > .top.tall { max-height: 999px; }
    .section-about-me > .wrapper > .top > .right > .images > .collapse > .left a svg { width: 100%; height: auto; }

    .section-opinions > .wrapper > .list { gap: 16px; }
    .section-opinions > .wrapper > .list > .item { width: 100%; gap: 8px; }
    .section-opinions > .wrapper > .list > .item > .left > .bubble { clip-path: none; border-radius: 20px; height: fit-content; gap: 0px; }
    .section-opinions > .wrapper > .list > .item > .left > .stars { height: 130px; }
}

@media all and (max-width: 450px) {

    .section-hero { padding-top: 110px; }
    .section-hero > .middle { margin-bottom: 0px; }

    .section-hero > .top > .right { padding: 50px 20px 0px 20px; }
    .section-hero > .top > .left > .left > h1 { width: 100%; }
    .section-hero > .top > .left > .right > .bubble { gap: 5px; padding: 10px 18px; }


    .section-hero > .middle > .inner { padding: 24px 16px 24px 16px; }
    .section-hero > .middle > .inner > .products > .product > .bg { padding: 16px 24px 16px 24px; }
    .section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .top { flex-direction: column; gap: 8px; }
    .section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .top > .right { text-align: left; }
    .section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .top > .right > .sale > .bottom { justify-content: flex-start; }
    .section-hero > .middle > .inner > .products > .product > .bg > .wrapper > .calories { width: 60%; margin-top: 6px; }
    .section-hero > .bottom > .box { font-size: 18px; }



    .section-tabs > .wrapper > .tabs { flex-direction: column; border-radius: 30px; padding: 18px; }
    .section-tabs > .wrapper > .tabs > .opt { border-radius: 6px !important; min-height: 46px; }
    .section-tabs > .wrapper > .tabs > .opt > svg { display: block; }

    .section-tabs > .wrapper > .view > .tab .cards > .left > .top { flex-direction: column; align-items: flex-start; gap: 16px; }
    .section-tabs > .wrapper > .view > .tab .cards > .right > .top { flex-direction: column; align-items: flex-start; gap: 16px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top > .badge { position: absolute; top: -10px; right: -10px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card { flex-direction: column; gap: 10px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .top > h3 { width: 100%; }

    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .icon { width: 50px; height: 50px; }
    .section-tabs > .wrapper > .view > .tab .cards > .card > .right > .bottom > .icon > svg { width: 20px; height: 20px; }

    .section-about-me > .wrapper > .top { gap: 24px; }
    .section-about-me > .wrapper > .top > .right > .images > .collapse > .left { border-radius: 20px;}
    .section-about-me > .wrapper > .top > .right > .images img { border-radius: 20px; }
    .section-about-me > .wrapper > .top > .right > .images picture { height: 300px; }
    .section-about-me > .wrapper > .top > .left > .top > .bottom > .right > .bottom { flex-direction: column; }

    .section-opinions > .wrapper > .top { padding: 16px; }
    .section-opinions > .wrapper > .top > .middle > .bottom > .rating { padding: 8px 16px; gap: 10px; }
    .section-opinions > .wrapper > .top > .middle > .bottom > .rating > .stars { gap: 8px; }
    .section-opinions > .wrapper > .top > .middle > .bottom > .rating > .stars > svg { width: 24px; height: 24px; }

    .popup-opinion > .rating { gap: 6px 12px; }
    .popup-opinion > .rating > .picker { gap: 4px; }
    .popup-opinion > .rating > .picker > svg { width: 24px; height: 24px; }

    .popup > .wrapper { gap: 12px; }
    .popup-booking > .notice { padding: 0px;}
    .popup-booking > .box > .right > .booking > .picker > .frames label { padding: 8px 0px; }
    .popup-booking .btn-fancy-long { margin-top: 10px; }
}