      :root{
        --text-dark: #333;
        --muted: #777;
        --accent: #9c3aa6;
        --green: #74bc31;
      }

      .site-main{
        padding: 0;
      }

      .site-main .container{
        display: block;
        align-items: stretch;
        justify-content: initial;
        max-width: none;
        padding: 0;
        width: 100%;
      }

      *{
        box-sizing: border-box;
      }

      body{
        margin: 0;
        font-family: "Manrope", Arial, sans-serif;
        color: var(--text-dark);
        background: #fff;
      }

      .hero{
        position: relative;
        overflow: hidden;
        padding: 40px 0 40px;
        background: url("https://i.ibb.co/4Rg4ymHz/Rectangle-12-1.png") center/cover no-repeat;
        margin-top: calc(-1 * var(--header-height, 80px));
        padding-top: calc(var(--header-height, 80px) + 40px);
      }

      .main-header{
        position: relative;
        z-index: 10;
      }


      .hero__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
        min-height: 420px;
        display: grid;
        grid-template-columns: 1.1fr 1fr;
        gap: 40px;
        align-items: center;
      }

      .hero__product{
        display: none;
      }

      .bottle{
        position: relative;
        width: 170px;
        height: 320px;
        transform: rotate(-12deg);
        filter: drop-shadow(0 18px 24px rgba(0,0,0,0.2));
      }

      .bottle__cap{
        position: absolute;
        top: -20px;
        left: 32px;
        width: 110px;
        height: 26px;
        background: linear-gradient(180deg, #f7f7f7, #cfcfcf);
        border-radius: 14px;
      }

      .bottle__pump{
        position: absolute;
        top: -44px;
        left: 58px;
        width: 60px;
        height: 50px;
        background: linear-gradient(180deg, #f8f8f8, #d8d8d8);
        border-radius: 12px 12px 6px 6px;
      }

      .bottle__neck{
        position: absolute;
        top: 0;
        left: 48px;
        width: 74px;
        height: 36px;
        background: linear-gradient(180deg, #f2f2f2, #d7d7d7);
        border-radius: 10px;
      }

      .bottle__body{
        position: absolute;
        top: 24px;
        left: 20px;
        width: 130px;
        height: 270px;
        background:
          linear-gradient(180deg, rgba(160,220,90,0.9), rgba(120,200,60,0.95)),
          linear-gradient(90deg, rgba(255,255,255,0.35), rgba(255,255,255,0));
        border-radius: 18px;
        border: 2px solid rgba(60,120,30,0.4);
        overflow: hidden;
      }

      .bottle__body::before{
        content: "";
        position: absolute;
        inset: 10px 20px auto 16px;
        height: 80%;
        background: linear-gradient(90deg, rgba(255,255,255,0.35), rgba(255,255,255,0));
        border-radius: 12px;
      }

      .page-hero {
        position: relative;
        color: #fff;
        background: var(--page-hero-bg, linear-gradient(120deg, #2f2a2a, #6b5d5d));
        background-position: center;
        background-size: cover;
        margin-top: calc(-1 * var(--header-height, 80px));
        padding: calc(var(--header-height, 80px) + 60px) 0 80px;
        min-height: 180px;
        display: flex;
        align-items: flex-end;
      }

      body.has-page-hero .page-hero{
        margin-top: 0;
      }

      .page-hero::before {
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, 0.45);
      }

      .page-hero__inner {
        position: relative;
        z-index: 1;
        display: flex;
        flex-direction: column;
        gap: 12px;
      }

      .page-hero__breadcrumbs ol {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        font-size: 14px;
        color: rgba(255, 255, 255, 0.8);
      }

      .page-hero__breadcrumbs li + li::before {
        content: "›";
        margin-right: 10px;
        color: rgba(255, 255, 255, 0.7);
      }

      .page-hero__breadcrumbs a {
        color: inherit;
        text-decoration: none;
      }

      .page-hero__breadcrumbs a:hover {
        text-decoration: underline;
      }

      .page-hero__title {
        margin: 0;
        font-size: 40px;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.5px;
      }

      @media (max-width: 768px) {
        .page-hero {
          padding: calc(var(--header-height, 80px) + 72px) 0 56px;
          min-height: 300px;
        }

        .page-hero__breadcrumbs ol {
          font-size: 12px;
        }

        .page-hero__title {
          font-size: 28px;
        }
      }

      .hero__content h1{
        margin: 0 0 12px;
        font-size: 48px;
        line-height: 1.15;
        letter-spacing: 0.5px;
        font-weight: 700;
        text-transform: uppercase;
      }

      .catalog-page{
        padding: 40px 0 70px;
      }

      .catalog-page__inner{
        display: grid !important;
        grid-template-columns: 260px 1fr;
        gap: 30px;
        align-items: start;
        max-width: 1200px;
        margin: 0 auto;
      }

      .catalog-page .container{
        display: block;
        max-width: 1200px;
        margin: 0 auto;
      }

      .catalog-page__sidebar{
        grid-column: 1;
        order: 0;
      }

      .catalog-page__content{
        grid-column: 2;
        order: 1;
      }

      .catalog-page__sidebar{
        padding: 10px 0 20px;
        background: #fff;
        border-right: 1px solid #e5e5e5;
        color: #222;
      }

      .catalog-side__group{
        padding: 16px 0;
        border-bottom: 1px solid #f0f0f0;
      }

      .catalog-side__title{
        width: 100%;
        background: none;
        border: none;
        color: #1e1e1e;
        font-size: 15px;
        font-weight: 700;
        text-align: left;
        padding: 0 18px 10px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        text-transform: uppercase;
        cursor: pointer;
      }

      .catalog-side__title--plain{
        text-transform: uppercase;
        color: #1e1e1e;
      }

      .catalog-side__group.is-open .catalog-side__title{
        color: #9b3aa6;
      }

      .catalog-side__chevron{
        width: 8px;
        height: 8px;
        border-right: 2px solid #1e1e1e;
        border-bottom: 2px solid #1e1e1e;
        transform: rotate(-135deg);
        margin-left: 8px;
        transition: transform 0.2s ease;
      }

      .catalog-side__group.is-open .catalog-side__chevron{
        transform: rotate(45deg);
        border-color: #9b3aa6;
      }

      .catalog-side__group:not(.is-open) .catalog-side__link{
        display: none;
      }

      .catalog-side__link{
        display: block;
        color: #444;
        text-decoration: none;
        padding: 6px 18px;
        font-size: 14px;
      }

      .catalog-side__link:hover{
        color: #000;
      }

      .catalog-side__group--range{
        padding-bottom: 20px;
      }

      .catalog-side__range{
        height: 3px;
        background: transparent;
        margin: 14px 18px 22px;
        position: relative;
      }

      .catalog-side__range-track{
        position: absolute;
        inset: 0;
        background: #bdbdbd;
        height: 3px;
      }

      .catalog-side__range-fill{
        position: absolute;
        left: 18%;
        right: 20%;
        top: 0;
        height: 3px;
        background: #9b3aa6;
      }

      .catalog-side__range-dot{
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #9b3aa6;
        display: block;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
      }

      .catalog-side__range-dot:first-child{
        left: 18%;
      }

      .catalog-side__range-dot:last-child{
        left: 80%;
      }

      .catalog-side__inputs{
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 12px;
        padding: 0 18px;
        margin-bottom: 16px;
        color: #666;
        font-size: 12px;
      }

      .catalog-side__input{
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 6px;
        align-items: center;
      }

      .catalog-side__input span{
        text-transform: lowercase;
      }

      .catalog-side__inputs input{
        width: 100%;
        border: 1px solid #bdbdbd;
        background: #fff;
        color: #222;
        padding: 8px 10px;
        font-size: 12px;
      }

      .catalog-side__apply{
        margin: 0 18px;
        width: calc(100% - 36px);
        background: #9b3aa6;
        color: #fff;
        border: none;
        padding: 10px 12px;
        font-size: 13px;
        text-transform: lowercase;
        cursor: pointer;
      }

      .catalog-page__grid{
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 10px;
      }

      .product-card{
        border: none;
        padding: 14px 14px 12px;
        position: relative;
 
        color: #222;
      }

      .product-card__badge{
        position: absolute;
        top: 10px;
        left: 10px;
        font-size: 10px;
        text-transform: uppercase;
        padding: 4px 8px;
        color: #fff;
        font-weight: 700;
      }

      .product-card__badge--new{
        background: #76c043;
      }

      .product-card__badge--hit{
        background: #f28a1f;
      }

      .product-card__badge--sale{
        background: #b34bc2;
      }

      .product-card__image{
        background: #fff;
        padding: 18px 12px;
        display: grid;
        place-items: center;
        min-height: 200px;
      }

      .product-card__image img{
        width: 100%;
        max-width: 160px;
        height: auto;
        display: block;
      }

      .product-card__name{
        font-size: 13px;
        color: #2d2d2d;
        margin: 12px 0 8px;
        min-height: 34px;
      }

      .product-card__footer{
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
      }

      .product-card__price{
        font-size: 16px;
        font-weight: 700;
        color: #222;
      }

      .product-card__cart{
        background: #b34bc2;
        border: none;
        width: 34px;
        height: 30px;
        display: grid;
        place-items: center;
        cursor: pointer;
      }

      .catalog-page__footer{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 30px;
        gap: 20px;
      }

      .catalog-page__more{
        background: #b34bc2;
        color: #fff;
        border: none;
        padding: 12px 22px;
        font-size: 13px;
        cursor: pointer;
        text-transform: lowercase;
      }

      .catalog-page__pagination{
        display: flex;
        align-items: center;
        gap: 8px;
      }

      .catalog-page__page{
        width: 28px;
        height: 28px;
        border: 1px solid rgba(255,255,255,0.2);
        background: transparent;
        color: #575757;
        cursor: pointer;
        font-size: 12px;
      }

      .catalog-page__page.is-active{
        background: #76c043;
        border-color: #76c043;
      }

      .catalog-page__dots{
        color: rgba(255,255,255,0.6);
      }
      .catalog-sort {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 20px;
        max-width: 1200px;
        margin: 0 auto 16px;
        padding: 0 20px;
      }

      .catalog-sort__label {
        font-size: 16px;
        color: #333;
      }

      .catalog-sort__select {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 250px;
        padding: 5px 20px;
        
        border: 1px solid #cfcfcf;
        background-color: #ffffff;
        
        font-size: 20px;
        color: #333;
        cursor: pointer;
      }

      .catalog-sort__select span {
        font-size: 16px;
      }

      .catalog-sort__arrow {
        width: 8px;
        height: 8px;
        border-right: 2px solid #999;
        border-bottom: 2px solid #999;
        transform: rotate(45deg);
        margin-left: 10px;
      }
      @media (max-width: 1200px){
        .catalog-page__grid{
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }
      }

      @media (max-width: 980px){
        .catalog-page__inner{
          grid-template-columns: 1fr;
        }

        .catalog-page__sidebar{
          order: 0;
          grid-column: 1;
        }

        .catalog-page__content{
          order: 1;
          grid-column: 1;
        }

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

      @media (max-width: 640px){
        .catalog-page__grid{
          grid-template-columns: 1fr;
        }

        .catalog-page__footer{
          flex-direction: column;
          align-items: center;
        }
      }

      .hero__content{
        margin-left: 660px;
      }

      .hero__content p{
        margin: 0 0 16px;
        font-size: 16px;
        color: var(--muted);
        max-width: 380px;
      }

      .hero__btn{
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: var(--accent);
        color: #fff;
        border: none;
        padding: 9px 18px;
        font-size: 16px;
        cursor: pointer;
      }

      .hero__dots{
        position: absolute;
        left: 50%;
        bottom: 92px;
        transform: translateX(-50%);
        display: flex;
        gap: 10px;
      }

      .hero__dots span{
        width: 9px;
        height: 9px;
        border-radius: 999px;
        background: #a9a9a9;
        display: inline-block;
      }

      .hero__dots span.active{
        background: #333;
      }

      .benefits{
        margin-top: -34px;
        padding-bottom: 24px;
        position: relative;
        z-index: 2;
      }

      .benefits__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 16px;
      }

      .benefit-card{
        background: #fff;
        box-shadow: 0 4px 16px rgba(0,0,0,0.08);
        padding: 12px 14px;
        display: flex;
        align-items: center;
        gap: 10px;
        min-height: 58px;
      }

      .benefit-icon{
        width: 40px;
        height: 40px;
        border-radius: 999px;
        background: var(--green);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        font-size: 14px;
        line-height: 1;
      }

      .benefit-text{
        font-size: 12px;
        color: #555;
        line-height: 1.2;
      }

      .catalog-section{
        
        color: #fff;
        padding: 24px 0 30px;
      }

      .catalog-inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
      }

      .catalog-top{
        display: flex;
        align-items: center;
        gap: 18px;
        margin-bottom: 18px;
      }

      .catalog-arrows{
        display: flex;
        gap: 14px;
        align-items: center;
        color: #bdbdbd;
      }

      .catalog-arrow{
        width: 28px;
        height: 28px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #3a3a3a;
        border-radius: 999px;
      }

      .catalog-btn{
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: #69B72E;
        color: #fff;
        border: none;
        padding: 10px 18px;
        font-size: 12px;
        cursor: pointer;
        text-transform: lowercase;
        white-space: nowrap;
      }

      .catalog-title{
        margin-left: auto;
        font-size: 28px;
        text-transform: uppercase;
        color: #1c1c1c;
        font-weight: 500;
      }

      .catalog-grid{
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 16px;
      }

      .catalog-card{
        display: flex;
        flex-direction: column;
        gap: 10px;
      }

      .catalog-card__image{
        width: 100%;
        aspect-ratio: 4 / 3;
        background-size: cover;
        background-position: center;
      }

      .catalog-card__title{
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 14px;
        text-transform: uppercase;
        color: #b73ac0;
      }

      .catalog-card__title span{
        color: #b73ac0;
      }

      .catalog-card__arrow{
        color: #b73ac0;
      }

      .about{
        padding: 26px 0 36px;
        color: #4c4c4c;
      }

      .about__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
      }

      .about__top{
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 14px;
      }

      .about__title{
        margin: 0;
        font-size: 28px;
        text-transform: uppercase;
        color: #1f1f1f;
        font-weight: 500;
      }

      .about__btn{
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: #9c3aa6;
        color: #fff;
        border: none;
        padding: 10px 18px;
        font-size: 14px;
        cursor: pointer;
        text-transform: lowercase;
      }

      .about__text{
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 40px;
        margin-bottom: 26px;
      }

      .about__text p{
        margin: 0;
        font-size: 14px;
        line-height: 1.5;
      }

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

      .about__photo{
        width: 100%;
        height: 230px;
        object-fit: cover;
        display: block;
      }

      .arrivals{
        padding: 32px 0 52px;
        color: #8a8a8a;
      }

      .arrivals__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
        position: relative;
      }

      .arrivals__title{
        margin: 0 0 22px;
        font-size: 28px;
        text-transform: uppercase;
        color: #252525;
        font-weight: 500;
      }

      .arrivals__stage{
        position: relative;
      }

      .arrivals__banner{
        width: min(1040px, 100%);
        height: 280px;
        object-fit: cover;
        display: block;
        margin: 0 auto;
      }

      .arrivals__arrows{
        position: absolute;
        left: -10px;
        right: -10px;
        top: 64%;
        transform: translateY(-50%);
        display: flex;
        justify-content: space-between;
        pointer-events: none;
        z-index: 3;
      }

      .arrivals__arrow{
        cursor: pointer;
        width: 34px;
        height: 34px;
        border: none;

        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
        pointer-events: auto;
        background: none;
      }

      .arrivals__list{
        display: grid;
        grid-template-columns: repeat(6, minmax(160px, 1fr));
        gap: 16px;
        margin-top: -74px;
        position: relative;
        z-index: 2;
      }

      .arrival-card{
        background: #fff;
        box-shadow: 0 10px 20px rgba(0,0,0,0.04);
        padding: 10px 10px 12px;
        display: flex;
        flex-direction: column;
        gap: 8px;
      }

      .arrival-card__image{
        background: #fff;

        padding: 12px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 150px;
      }

      .arrival-card__badge{
        position: absolute;
        top: 8px;
        left: 8px;
        background: #74bc31;
        color: #fff;
        font-size: 10px;
        padding: 4px 8px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        border-radius: 2px;
      }

      .arrival-card__fav{
        position: absolute;
        top: 8px;
        right: 8px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }

      .arrival-card__image img{
        max-height: 130px;
        object-fit: contain;
        display: block;
      }

      .arrival-card__title{
        font-size: 12px;
        color: #2e2e2e;
        line-height: 1.35;
        min-height: 34px;
      }

      .arrival-card__bottom{
        display: flex;
        align-items: center;
        justify-content: space-between;
      }

      .arrival-card__price{
        color: #2b2b2b;
        font-size: 16px;
        font-weight: 700;
      }

      .arrival-card__cart{
        width: 34px;
        height: 32px;
        border: none;
        background: #9c3aa6;
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
      }

      .arrival-card--active .arrival-card__title,
      .arrival-card--active .arrival-card__price{
        color: #b43cc0;
      }

      .bestsellers{
        padding: 26px 0 44px;
        color: #8a8a8a;
        background-color: #fbfbfb;
      }

      .bestsellers__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
        position: relative;
        background-image: none;
      }

      .bestsellers__title{
        margin: 0 0 18px;
        font-size: 28px;
        text-transform: uppercase;
        color: #1f1f1f;
        font-weight: 500;
        text-align: right;
      }

      .bestsellers__content{
        display: grid;
        grid-template-columns: 1.15fr 2.2fr;
        gap: 20px;
        align-items: start;
      }

      .bestsellers__banner{
        width: 100%;
        height: 410px;
        object-fit: cover;
        display: block;
        background: #fff;
      }

      .bestsellers__products{
        position: relative;
      }

      .bestsellers__arrows{
        position: absolute;
        left: -10px;
        right: -10px;
        top: 70px;
        display: flex;
        justify-content: space-between;
        pointer-events: none;
      }

      .bestsellers__arrow{
        width: 34px;
        height: 34px;
        color: #b2b2b2;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 26px;
        pointer-events: auto;
        background: none;
        border: none;
        cursor: pointer;
      }

      .bestsellers__list{
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 16px;
      }

      .bestseller-card{
        display: flex;
        flex-direction: column;
        gap: 10px;
        background: #fff;
        padding: 12px 12px 14px;
      }

      .bestseller-card__image{
        background: #fff;
        padding: 12px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 170px;
      }

      .bestseller-card__badge{
        position: absolute;
        top: 8px;
        left: 8px;
        background: #e78922;
        color: #fff;
        font-size: 10px;
        padding: 4px 8px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
      }

      .bestseller-card__fav{
        position: absolute;
        top: 8px;
        right: 8px;
        font-size: 16px;
        color: #4c4c4c;
      }

      .bestseller-card__image img{
        
        height: 130px;
        display: block;
      }

      .bestseller-card__title{
        font-size: 12px;
        color: #7a7a7a;
        line-height: 1.3;
        min-height: 32px;
      }

      .bestseller-card__title.is-active{
        color: #b43cc0;
      }

      .bestseller-card__bottom{
        display: flex;
        align-items: center;
        justify-content: space-between;
      }

      .bestseller-card__price{
        color: #b43cc0;
        font-size: 18px;
        font-weight: 700;
      }

      .bestseller-card__cart{
        width: 38px;
        height: 32px;
        border: none;
        background: #9c3aa6;
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
      }

      .deals{
        padding: 26px 0 44px;
        color: #8a8a8a;
      }

      .deals__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
      }

      .deals__top{
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 16px;
        margin-bottom: 16px;
      }

      .deals__arrows{
        display: flex;
        gap: 12px;
        align-items: center;
        color: #9a9a9a;
      }

      .deals__arrow{
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        color: #b5b5b5;
        border: none;
        background: none;
      }

      .deals__btn{
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: #9c3aa6;
        color: #fff;
        border: none;
        padding: 9px 16px;
        font-size: 12px;
        cursor: pointer;
        text-transform: lowercase;
      }

      .deals__title{
        margin: 0 0 0 12px;
        font-size: 28px;
        text-transform: uppercase;
        color: #1f1f1f;
        font-weight: 500;
      }

      .deals__content{
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 16px;
        align-items: start;
      }

      .deals__products{
        grid-column: 1 / -1;
        grid-row: 2;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 16px;
        max-width: 860px;
        margin-top: -48px;
        position: relative;
        z-index: 2;
      }

      .deal-card{
        display: flex;
        flex-direction: column;
        gap: 10px;
        background: #fff;
        padding: 10px 10px 12px;
        box-shadow: 0 10px 20px rgba(0,0,0,0.04);
      }

      .deal-card__image{
        background: #fff;
        padding: 12px 8px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 150px;
      }

      .deal-card__badge{
        position: absolute;
        top: 8px;
        left: 8px;
        background: #9c3aa6;
        color: #fff;
        font-size: 10px;
        padding: 4px 8px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
      }

      .deal-card__fav{
        position: absolute;
        top: 8px;
        right: 8px;
        font-size: 16px;
        color: #4c4c4c;
      }

      .deal-card__image img{

        max-height: 130px;
        object-fit: contain;
        height: auto;
        display: block;
      }

      .deal-card__title{
        font-size: 12px;
        color: #2e2e2e;
        line-height: 1.3;
        min-height: 34px;
      }

      .deal-card__title.is-active{
        color: #b43cc0;
      }

      .deal-card__bottom{
        display: flex;
        align-items: center;
        justify-content: space-between;
      }

      .deal-card__price{
        color: #7ad13c;
        font-size: 16px;
        font-weight: 700;
      }

      .deal-card__cart{
        width: 34px;
        height: 32px;
        border: none;
        background: #9c3aa6;
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
      }

      .deals__banner{
        grid-column: 2 / 5;
        grid-row: 1;
        width: 100%;
        height: 260px;
        object-fit: cover;
        display: block;
        position: relative;
        z-index: 1;
      }

      .also-buy{
        padding: 28px 0 48px;
        color: #8a8a8a;
        --also-buy-shift: 180px;
      }

      .also-buy__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
      }

      .also-buy__top{
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 18px;
      }

      .also-buy__title{
        margin: 0;
        font-size: 28px;
        text-transform: uppercase;
        color: #1f1f1f;
        font-weight: 500;
      }

      .also-buy__arrows{
        display: flex;
        gap: 12px;
        align-items: center;
        color: #9a9a9a;
      }

      .also-buy__arrow{
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: none;
        background: none;
        padding: 0;
      }

      .also-buy__content{
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 16px;
        align-items: start;
      }

      .also-buy__banner{
        grid-column: 1 / -1;
        grid-row: 1;
        width: calc(100% - var(--also-buy-shift));
        height: 260px;
        object-fit: cover;
        display: block;
        position: relative;
        z-index: 1;
      }

      .also-buy__products{
        grid-column: 1 / -1;
        grid-row: 2;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 16px;
        margin-top: -48px;
        margin-left: var(--also-buy-shift);
        position: relative;
        z-index: 2;
      }

      .also-buy .deal-card__price{
        color: #1f1f1f;
      }

      .deal-card__badge--green{
        background: #6bc23e;
      }

      .deal-card__badge--purple{
        background: #9c3aa6;
      }

      .certificates{
        padding: 32px 0 42px;
        color: #8d8d8d;
      }

      .quick-buy{
        padding: 24px 0;
        color: #4a4a4a;
      }

      .quick-buy__inner{
        max-width: 320px;
        margin: 0 auto;
        padding: 22px 22px 18px;
        background: #fff;
        border: 1px solid #eee;
      }

      .quick-buy__top{
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 10px;
      }

      .quick-buy__title{
        margin: 0;
        font-size: 20px;
        font-weight: 600;
        letter-spacing: 0.5px;
        color: #222;
      }

      .quick-buy__close{
        border: none;
        background: none;
        font-size: 20px;
        line-height: 1;
        color: #8a8a8a;
        cursor: pointer;
      }

      .quick-buy__product{
        font-size: 14px;
        color: #6a6a6a;
        line-height: 1.4;
        margin-bottom: 18px;
      }

      .quick-buy__form{
        display: grid;
        gap: 12px;
      }

      .quick-buy__label{
        font-size: 14px;
        color: #3a3a3a;
      }

      .quick-buy__input{
        width: 100%;
        height: 44px;
        border: 1px solid #bfbfbf;
        padding: 0 12px;
        font-size: 14px;
        color: #333;
        background: #fff;
      }

      .quick-buy__input::placeholder{
        color: #9a9a9a;
      }

      .quick-buy__submit{
        margin-top: 6px;
        height: 40px;
        border: none;
        background: #9c3aa6;
        color: #fff;
        font-size: 14px;
        text-transform: lowercase;
        cursor: pointer;
      }

      .quick-buy__consent{
        display: grid;
        grid-template-columns: 16px 1fr;
        gap: 10px;
        align-items: start;
        font-size: 13px;
        color: #3a3a3a;
        margin-top: 6px;
      }

      .quick-buy__checkbox{
        width: 16px;
        height: 16px;
        margin: 2px 0 0;
      }

      .quick-buy-modal{
        position: fixed;
        inset: 0;
        display: none;
        align-items: center;
        justify-content: center;
        z-index: 2000;
        padding: 24px;
      }

      .quick-buy-modal.is-open{
        display: flex;
      }

      .quick-buy-modal__backdrop{
        position: absolute;
        inset: 0;
        background: rgba(0,0,0,0.35);
      }

      .quick-buy-modal__content{
        position: relative;
        z-index: 1;
        width: 100%;
        max-width: 360px;
      }

      body.is-locked{
        overflow: hidden;
      }

      .receipt-report-modal{
        position: fixed;
        inset: 0;
        display: none;
        align-items: center;
        justify-content: center;
        z-index: 2000;
        padding: 24px;
      }

      .receipt-report-modal.is-open{
        display: flex;
      }

      .receipt-report-modal__backdrop{
        position: absolute;
        inset: 0;
        background: rgba(0,0,0,0.35);
      }

      .receipt-report-modal__content{
        position: relative;
        z-index: 1;
        width: 100%;
        max-width: 360px;
      }

      .receipt-report{
        padding: 24px 0;
        color: #4a4a4a;
      }

      .receipt-report__inner{
        max-width: 320px;
        margin: 0 auto;
        padding: 22px 22px 18px;
        background: #fff;
        border: 1px solid #eee;
      }

      .receipt-report__top{
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 10px;
      }

      .receipt-report__title{
        margin: 0;
        font-size: 20px;
        font-weight: 600;
        letter-spacing: 0.5px;
        color: #222;
        line-height: 1.1;
      }

      .receipt-report__close{
        border: none;
        background: none;
        font-size: 20px;
        line-height: 1;
        color: #8a8a8a;
        cursor: pointer;
      }

      .receipt-report__note{
        font-size: 14px;
        color: #6a6a6a;
        line-height: 1.4;
        margin-bottom: 18px;
      }

      .receipt-report__form{
        display: grid;
        gap: 12px;
      }

      .receipt-report__label{
        font-size: 14px;
        color: #3a3a3a;
      }

      .receipt-report__input{
        width: 100%;
        height: 44px;
        border: 1px solid #bfbfbf;
        padding: 0 12px;
        font-size: 14px;
        color: #333;
        background: #fff;
      }

      .receipt-report__input::placeholder{
        color: #9a9a9a;
      }

      .receipt-report__submit{
        margin-top: 6px;
        height: 40px;
        border: none;
        background: #9c3aa6;
        color: #fff;
        font-size: 14px;
        text-transform: lowercase;
        cursor: pointer;
      }

      .receipt-report__consent{
        display: grid;
        grid-template-columns: 16px 1fr;
        gap: 10px;
        align-items: start;
        font-size: 13px;
        color: #3a3a3a;
        margin-top: 6px;
      }

      .receipt-report__checkbox{
        width: 16px;
        height: 16px;
        margin: 2px 0 0;
      }

      .certificates__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
      }

      .certificates__top{
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 18px;
      }

      .certificates__title{
        margin: 0;
        font-size: 28px;
        text-transform: uppercase;
        color: #1f1f1f;
        font-weight: 500;
      }

      .certificates__arrows{
        display: flex;
        gap: 12px;
        align-items: center;
        color: #9a9a9a;
      }

      .certificates__arrow{
        cursor: pointer;
        background: none;
        border: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }

      .certificates__grid{
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 16px;
      }

      .help-form{
        padding: 30px 0 60px;
      }

      .help-form__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 40px;
        align-items: stretch;
      }

      .help-form__collage{
        position: relative;
        width: 100%;
        height: 100%;
        background: #fff;
      }

      .help-form__tile{
        position: absolute;
        background-size: cover;
        background-position: center;
      }

      .help-form__tile--left{
        left: 0;
        top: 0;
        width: 61.905%;
        height: 73.35%;
        background-image: url('https://netsh.pp.ua/wp-content/uploads/2017/08/Placeholder-1.png');
      }

      .help-form__tile--right{
        left: 38.095%;
        top: 26.692%;
        width: 61.905%;
        height: 73.35%;
        background-image: url('https://netsh.pp.ua/wp-content/uploads/2017/08/Placeholder-1.png');
      }

      .help-form__content h2{
        margin: 0 0 12px;
        font-size: 30px;
        line-height: 1.2;
        letter-spacing: 1px;
        text-transform: uppercase;
        color: #2b2b2b;
      }

      .help-form__content p{
        margin: 0 0 20px;
        color: #666;
        font-size: 16px;
      }

      .help-form__content{
        display: flex;
        flex-direction: column;
        height: 100%;
      }

      .help-form__grid{
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 20px;
        margin-bottom: 18px;
      }

      .help-form__field{
        display: flex;
        flex-direction: column;
        gap: 8px;
      }

      .help-form__field--full{
        grid-column: 1 / -1;
      }

      .help-form__label{
        font-size: 14px;
        color: #4b4b4b;
      }

      .help-form__input,
      .help-form__textarea{
        width: 100%;
        border: 1px solid #9a9a9a;
        padding: 10px 14px;
        font-size: 14px;
        outline: none;
        background: #fff;
      }

      .help-form__input--accent{
        border-color: #9c3aa6;
      }

      .help-form__textarea{
        min-height: 46px;
        resize: vertical;
      }

      .help-form__input-wrap{
        position: relative;
      }

      .help-form__clear{
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        border: none;
        background: none;
        cursor: pointer;
        font-size: 16px;
        color: #777;
      }

      .help-form__submit{
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: #9c3aa6;
        color: #fff;
        border: none;
        padding: 12px 26px;
        font-size: 14px;
        text-transform: lowercase;
        cursor: pointer;
      }

      @media (max-width: 900px){
        .help-form__inner{
          grid-template-columns: 1fr;
        }

        .help-form__grid{
          grid-template-columns: 1fr;
        }
      }

      .brands{
        padding: 10px 0 60px;
      }

      .brands__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
      }

      .brands__top{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 18px;
      }

      .brands__title{
        margin: 0;
        font-size: 28px;
        text-transform: uppercase;
        color: #2b2b2b;
        font-weight: 500;
      }

      .brands__arrows{
        display: flex;
        gap: 12px;
        align-items: center;
        color: #9a9a9a;
      }

      .brands__arrow{
        border: none;
        cursor: pointer;
        background: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 18px;
      }

      .brands__list{
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: 210px;
        gap: 30px;
        overflow-x: auto;
        padding-bottom: 6px;
      }

      .brands__card{
        width: 210px;
        height: 210px;
        background: #fafafa;
        display: flex;
        align-items: center;
        justify-content: center;
      }

      .brands__logo{
        width: 90px;
        height: 90px;
        object-fit: contain;
        display: block;
      }

      .info{
        padding: 20px 0 60px;
      }

      .info__inner{
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
      }

      .info__top{
        display: grid;
        grid-template-columns: 220px 1fr auto;
        align-items: center;
        gap: 24px;
        margin-bottom: 24px;
      }

      .info__mark{
        width: 220px;
        height: 48px;
        background: #9f37a4;
      }

      .info__tabs{
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 14px;
        color: #888;
        font-size: 16px;
      }

      .info__tabs a{
        text-decoration: none;
        color: #888;
      }

      .info__tabs a.is-active{
        color: #66b63a;
      }

      .info__title{
        margin: 0;
        font-size: 28px;
        text-transform: uppercase;
        color: #2b2b2b;
        font-weight: 500;
      }

      .info__grid{
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 30px;
      }

      .info-card__image{
        width: 100%;
        aspect-ratio: 1 / 1;
        background: #f2f2f2;
        overflow: hidden;
      }

      .info-card__image img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
      }

      .info-card__date{
        margin: 16px 0 8px;
        color: #777;
        font-size: 14px;
      }

      .info-card__title{
        margin: 0 0 10px;
        font-size: 16px;
        text-transform: uppercase;
        color: #2b2b2b;
      }

      .info-card__link{
        color: #9f37a4;
        text-decoration: none;
        font-size: 14px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
      }
      .info__btn{
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: #9c3aa6;
        color: #fff;
        border: none;
        padding: 10px 18px;
        font-size: 14px;
        cursor: pointer;
        text-transform: lowercase;
      }

      @media (max-width: 1200px){
        .info__top{
          grid-template-columns: 1fr;
          justify-items: start;
        }

        .info__tabs{
          justify-content: flex-start;
        }

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

      @media (max-width: 700px){
        .info__grid{
          grid-template-columns: 1fr;
        }
      }

      .certificate-card{
        background: #fff;
        padding: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 200px;
        position: relative;
      }

      .certificate-card__image{
        width: 100%;
        max-width: 220px;
        aspect-ratio: 4 / 3;
        border: 1px solid #eee;
        background: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
      }

      .certificate-card__image img{
        width: 100%;
        height: 100%;
        object-fit: contain;
        display: block;
      }

      .certificate-card__zoom{
        position: absolute;
        inset: 0;
        margin: auto;
        width: 46px;
        height: 46px;
        border-radius: 999px;
        background: rgba(0,0,0,0.6);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        font-size: 18px;
        pointer-events: none;
      }

      @media (max-width: 900px){
        .hero__inner{
          grid-template-columns: 1fr;
          text-align: center;
        }

        .hero__product{
          order: 2;
          height: 300px;
        }

        .hero__content{
          order: 1;
        }

        .hero__content p{
          margin-left: auto;
          margin-right: auto;
        }

        .hero__dots{
          bottom: 74px;
        }

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

        .catalog-top{
          flex-wrap: wrap;
          gap: 12px;
        }

        .catalog-title{
          margin-left: 0;
          font-size: 18px;
          color: #2a2a2a;
        }

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

        .about__top{
          flex-wrap: wrap;
        }

        .about__text{
          grid-template-columns: 1fr;
          gap: 18px;
        }

        .about__gallery{
          grid-template-columns: 1fr;
        }

        .arrivals__list{
          grid-template-columns: repeat(2, minmax(0, 1fr));
          margin-top: -40px;
        }

        .arrivals__arrows{
          display: none;
        }

        .arrivals__banner{
          height: 220px;
        }

        .bestsellers__content{
          grid-template-columns: 1fr;
        }

        .bestsellers__title{
          text-align: left;
        }

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

        .bestsellers__arrows{
          display: none;
        }

        .deals__top{
          justify-content: flex-start;
          flex-wrap: wrap;
        }

        .deals__content{
          grid-template-columns: 1fr;
        }

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

        .deals__banner{
          grid-column: auto;
          grid-row: auto;
        }

        .also-buy{
          --also-buy-shift: 0px;
        }

        .also-buy__top{
          justify-content: flex-start;
          flex-wrap: wrap;
        }

        .also-buy__content{
          grid-template-columns: 1fr;
        }

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

        .also-buy__banner{
          grid-column: auto;
          grid-row: auto;
        }

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

      @media (max-width: 600px){
        .hero{
          padding-top: 24px;
        }

        .hero__inner{
          min-height: 360px;
        }

        .hero__content h1{
          font-size: 22px;
        }

        .benefits__inner{
          grid-template-columns: 1fr;
        }

        .hero__dots{
          bottom: 60px;
        }

        .catalog-grid{
          grid-template-columns: 1fr;
        }

        .deals__products{
          grid-template-columns: 1fr;
        }

        .also-buy__products{
          grid-template-columns: 1fr;
        }

        .certificates__grid{
          grid-template-columns: 1fr;
        }
      }
    
      .page-hero .container{
        max-width: 1200px !important;
        width: min(1200px, 100%) !important;
        margin: 0 auto !important;
        padding: 0 20px !important;
        display: block;
      }


      .page-hero__title{
        transform: translateY(42px);
      }

      .text-description{
        color: #fff;
        padding: 40px 0 60px;
        max-width: 1200px;
        margin: 0 auto;
      }

      .text-description__inner{
        max-width: 1200px;
        margin: 0 auto;
      }

      .text-description__title{
        margin: 0 0 16px;
        font-size: 28px;
        text-transform: uppercase;
        color: #3a3a3a;
        font-weight: 500;
      }

      .text-description__media{
        background: #111;
        margin-bottom: 18px;
      }

      .text-description__media img{
        width: 100%;
        height: 360px;
        object-fit: cover;
        display: block;
      }

      .text-description__grid{
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px;
        color: #4a4a4a;
        font-size: 14px;
        line-height: 1.5;
      }

      .text-description__grid p{
        margin: 0;
      }

      @media (max-width: 900px){
        .text-description__media img{
          height: 280px;
        }

        .text-description__grid{
          grid-template-columns: 1fr;
        }
      }

      @media (max-width: 640px){
        .text-description{
          padding: 32px 16px 48px;
        }

        .text-description__title{
          font-size: 24px;
          text-align: center;
        }

        .text-description__media img{
          height: 220px;
        }

        .text-description__grid{
          font-size: 13px;
        }
      }

      .breadcrumbs{
        width: min(1200px, 100%);
        margin: 26px auto 32px;
        padding: 0 20px;
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 16px;
        line-height: 1.2;
        color: #7a7a7a;
      }

      .breadcrumbs__link{
        color: #7a7a7a;
        text-decoration: none;
        transition: color 0.2s ease;
      }

      .breadcrumbs__link:hover{
        color: #5f5f5f;
      }

      .breadcrumbs__sep{
        color: #6c6c6c;
      }

      .breadcrumbs__current{
        color: #7a7a7a;
      }

      @media (max-width: 900px){
        .breadcrumbs{
          font-size: 16px;
          gap: 10px;
          margin: 22px auto 28px;
        }
      }

      @media (max-width: 640px){
        .breadcrumbs{
          font-size: 12px;
          gap: 8px;
          margin: 18px auto 22px;
        }
      }

      .product__card {
        width: 100%;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 24px;
      }

      .product__card-container {
        display: flex;
        gap: 40px;
      }

      /* Галерея */
      .product__card-gallery {
        display: flex;
        gap: 20px;
      }

      .product__card-thumbs {
        display: flex;
        flex-direction: column;
        gap: 15px;
      }

      .product__card-thumbs img {
        width: 80px;
        height: 80px;
        object-fit: cover;
        background: #fff;
      }

      .product__card-main {
        position: relative;
        width: 500px;
        height: 500px;
        background: #eaeaea;
        display: flex;
        align-items: center;
        justify-content: center;
      }

      .product__card-main img {
        max-width: 90%;
      }

      .product__card-badge {
        position: absolute;
        top: 20px;
        left: 20px;
        background: #6bc23e;
        color: #fff;
        padding: 5px 10px;
        font-size: 14px;
      }

      /* Правая часть */
      .product__card-info {
        flex: 1;
      }

      .product__card-title {
        font-size: 28px;
        margin-bottom: 15px;
      }

      .product__card-meta {
        display: flex;
        gap: 20px;
        font-size: 14px;
        margin-bottom: 20px;
      }

      .product__card-stock {
        color: #6bc23e;
      }

      .product__card-price-row {
        display: flex;
        align-items: center;
        gap: 20px;
        margin-bottom: 20px;
      }

      .product__card-price {
        font-size: 28px;
        font-weight: bold;
      }

      .product__card-counter {
        display: flex;
        align-items: center;
      }

      .product__card-counter input {
        width: 60px;
        text-align: center;
        border: none;
        background: #fff;
        height: 35px;
      }

      .product__card-counter button {
        width: 35px;
        height: 35px;
        border: none;
        color: #444;
        cursor: pointer;
      }

      .product__card-fav {
        font-size: 22px;
        cursor: pointer;
      }

      /* Кнопки */
      .product__card-buttons {
        display: flex;
        gap: 15px;
        margin-bottom: 30px;
      }

      .btn {
        padding: 12px 25px;
        border: none;
        cursor: pointer;
        font-size: 14px;
      }

      .btn--cart {
        background: #9b3aa7;
        color: #fff;
      }

      .btn--buy {
        background: #6bc23e;
        color: #fff;
      }

      /* Описание */
      .product__card-short h3 {
        font-size: 16px;
        margin-bottom: 10px;
      }

      .product__card-short p {
        font-size: 14px;
        color: #aaa;
        margin-bottom: 10px;
      }

      .product__card-short a {
        color: #d34cff;
        text-decoration: none;
      }

      @media (max-width: 900px){
        .product__card-container {
          flex-direction: column;
          gap: 28px;
        }

        .product__card-gallery {
          flex-direction: column;
        }

        .product__card-main {
          width: 100%;
          height: auto;
          aspect-ratio: 1 / 1;
        }

        .product__card-main img {
          max-width: 100%;
          max-height: 100%;
        }

        .product__card-info {
          width: 100%;
        }
      }

      @media (max-width: 640px){
        .product__card {
          padding: 0 16px;
        }

        .product__card-gallery {
          gap: 14px;
        }

        .product__card-thumbs {
          flex-direction: row;
          gap: 10px;
          overflow-x: auto;
          padding-bottom: 4px;
        }

        .product__card-thumbs img {
          width: 64px;
          height: 64px;
          flex: 0 0 auto;
        }

        .product__card-badge {
          top: 12px;
          left: 12px;
          font-size: 12px;
        }

        .product__card-title {
          font-size: 20px;
          margin-bottom: 10px;
        }

        .product__card-meta {
          flex-direction: column;
          gap: 6px;
          margin-bottom: 14px;
        }

        .product__card-price-row {
          flex-wrap: wrap;
          gap: 12px;
        }

        .product__card-price {
          font-size: 22px;
        }

        .product__card-counter {
          order: 2;
        }

        .product__card-fav {
          order: 3;
        }

        .product__card-buttons {
          flex-direction: column;
          gap: 10px;
        }

        .btn {
          width: 100%;
        }

        .product__card-short h3 {
          font-size: 14px;
        }

        .product__card-short p,
        .product__card-short a {
          font-size: 13px;
        }
      }

      .product__details {
        width: 100%;
        max-width: 1200px;
        margin: 60px auto 0;
        padding: 0 24px 40px;
      }

      .product__details-tabs {
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 16px;
        color: #6f6f6f;
        margin-bottom: 20px;
        text-transform: lowercase;
      }

      .product__details-tabs button {
        border: none;
        background: none;
        padding: 0;
        font-size: 16px;
        color: inherit;
        cursor: pointer;
      }

      .product__details-tabs button.is-active {
        color: #6bc23e;
      }

      .product__details-panel {
        display: none;
      }

      .product__details-panel.is-active {
        display: block;
      }

      .product__details-body {
        display: grid;
        grid-template-columns: 1.05fr 1fr;
        gap: 40px;
        align-items: start;
      }

      .product__details-media img {
        width: 90%;
        height: auto;
        display: block;
        object-fit: cover;
        background: #f2f2f2;
      }

      .product__details-content {
        margin-top: 80px;
      }

      .product__details-content h2 {
        margin: 0 0 16px;
        font-size: 18px;
        letter-spacing: 0.5px;
      }

      .product__details-text {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px;
        font-size: 14px;
        line-height: 1.6;
        color: #4a4a4a;
      }

      .product__details-text p {
        margin: 0;
      }

      .product__details-panel--specs .product__details-body {
        grid-template-columns: 1fr 1.05fr;
      }

      .product__details-panel--specs .product__details-media {
        order: 2;
      }

      .product__details-panel--specs .product__details-content {
        order: 1;
      }

      .product__details-specs {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px 28px;
        font-size: 14px;
        color: #4a4a4a;
      }

      .specs__row {
        display: grid;
        grid-template-columns: auto 1fr auto;
        align-items: center;
        gap: 10px;
        padding-bottom: 8px;
        border-bottom: 1px solid #efefef;
      }

      .specs__dots {
        height: 0;
        border-bottom: 1px dotted #d6d6d6;
      }

      @media (max-width: 900px){
        .product__details-body {
          grid-template-columns: 1fr;
        }

        .product__details-text {
          grid-template-columns: 1fr;
        }

        .product__details-specs {
          grid-template-columns: 1fr;
        }
      }

      /* Shopping cart page */
      .cart-section {
        background: #fff;
        padding: 36px 0 64px;
      }

      .cart-section .container {
        display: block;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 20px;
      }

      .cart-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 280px;
        gap: 28px;
        align-items: start;
      }

      .cart-items {
        background: #fff;
        border: 1px solid #f0f0f0;
      }

      .cart-item {
        display: grid;
        grid-template-columns: 180px 1fr 140px 40px;
        align-items: center;
        gap: 0;
        padding: 26px 18px;
        border-bottom: 1px solid #f0f0f0;
      }

      .cart-item:last-child {
        border-bottom: none;
      }

      .cart-item__media {
        background: #fafafa;
        border: 1px solid #f3f3f3;
        padding: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 140px;
      }

      .cart-item__media img {
        width: 110px;
        height: auto;
        display: block;
      }

      .cart-item__info {
        padding-left: 24px;
        border-left: 1px solid #f0f0f0;
      }

      .cart-item__sku {
        font-size: 12px;
        color: #777;
        margin-bottom: 8px;
      }

      .cart-item__title {
        font-size: 14px;
        line-height: 1.35;
        letter-spacing: 0.2px;
        text-transform: uppercase;
        margin-bottom: 16px;
        color: #222;
      }

      .cart-item__price {
        font-size: 18px;
        font-weight: 600;
        margin-bottom: 10px;
      }

      .cart-item__qty {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        border: 1px solid #eee;
        padding: 6px 10px;
        height: 32px;
      }

      .qty-btn {
        border: none;
        background: transparent;
        color: #777;
        width: 18px;
        height: 18px;
        line-height: 18px;
        font-size: 16px;
        cursor: pointer;
      }

      .qty-value {
        font-size: 13px;
        color: #333;
        min-width: 12px;
        text-align: center;
      }

      .cart-item__total {
        text-align: right;
        font-size: 18px;
        font-weight: 600;
        padding-left: 24px;
        border-left: 1px solid #f0f0f0;
      }

      .cart-item__remove {
        background: transparent;
        border: none;
        color: #888;
        font-size: 18px;
        cursor: pointer;
        justify-self: center;
      }

      .cart-summary__box {
        background: #f6f6f6;
        padding: 22px;
        border: 1px solid #ededed;
      }

      .cart-summary__title {
        font-size: 14px;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        margin-bottom: 18px;
        color: #222;
      }

      .cart-summary__row {
        display: flex;
        justify-content: space-between;
        font-size: 13px;
        color: #666;
        margin-bottom: 10px;
      }

      .cart-summary__total {
        display: flex;
        justify-content: space-between;
        font-size: 14px;
        font-weight: 600;
        margin: 16px 0 22px;
      }

      .cart-summary__btn {
        width: 100%;
        border: none;
        background: #9c3aa6;
        color: #fff;
        padding: 12px 14px;
        text-transform: lowercase;
        font-size: 14px;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
      }

      @media (max-width: 1024px) {
        .cart-layout {
          grid-template-columns: 1fr;
        }

        .cart-item {
          grid-template-columns: 140px 1fr 120px 28px;
        }
      }

      @media (max-width: 768px) {
        .cart-item {
          grid-template-columns: 1fr;
          gap: 12px;
        }

        .cart-item__info,
        .cart-item__total {
          border-left: none;
          padding-left: 0;
        }

        .cart-item__total {
          text-align: left;
        }

        .cart-item__remove {
          justify-self: start;
        }
      }


        .checkout-wrapper {
            width: min(1200px, 100%);
            margin: 0 auto;
            padding: 40px 20px;
            box-sizing: border-box;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 20px;
        }

        .main-form {
            grid-column: 1 / 4;
            display: grid;
            grid-template-columns: 1fr 2fr;
            row-gap: 60px;
            padding-right: 40px;
        }

        .section-title {
            font-size: 18px;
            font-weight: 700;
            text-transform: uppercase;
            line-height: 1.2;
            color: #222;
        }

        /* Радиокнопки */
        .options-group {
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .radio-item {
            display: flex;
            align-items: center;
            cursor: pointer;
            font-size: 15px;
        }

        .radio-item input {
            display: none;
        }

        .radio-custom {
            width: 18px;
            height: 18px;
            border: 1px solid #ccc;
            border-radius: 50%;
            margin-right: 15px;
            position: relative;
        }

        .radio-item input:checked + .radio-custom::after {
            content: '';
            position: absolute;
            top: 4px; left: 4px;
            width: 8px; height: 8px;
            background: #a33eb1;
            border-radius: 50%;
        }

        /* Поля ввода */
        .form-fields {
            display: flex;
            flex-direction: column;
            gap: 25px;
        }

        .input-group {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .input-group label {
            font-size: 12px;
            color: #666;
        }

        .input-group input, 
        .input-group textarea {
            width: 100%;
            padding: 12px 15px;
            border: 1px solid #ccc;
            border-radius: 2px;
            font-size: 14px;
            font-family: inherit;
        }

        .input-group input::placeholder,
        .input-group textarea::placeholder {
            color: #bbb;
        }

        textarea {
            height: 60px;
            resize: none;
        }

        /* Боковая панель */
        .sidebar {
            grid-column: 4 / 5;
            background: #f9f9f9;
            padding: 30px;
            height: fit-content;
        }

        .summary-title {
            font-weight: 700;
            font-size: 16px;
            margin-bottom: 25px;
            text-transform: uppercase;
        }

        .summary-row {
            display: flex;
            justify-content: space-between;
            font-size: 14px;
            margin-bottom: 12px;
            color: #444;
        }

        .summary-row .dots {
            flex-grow: 1;
            border-bottom: 1px dotted #ccc;
            margin: 0 5px;
            position: relative;
            top: -4px;
        }

        .total-row {
            margin-top: 30px;
            font-weight: 700;
            font-size: 18px;
        }

        /* Кнопки */
        .btn-submit {
            background-color: #a33eb1;
            color: white;
            border: none;
            padding: 12px 25px;
            font-size: 13px;
            text-transform: lowercase;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 10px;
            transition: background 0.2s;
            width: fit-content;
        }

        .btn-submit:hover {
            background-color: #8e359a;
        }

        .sidebar .btn-submit {
            width: 100%;
            margin-top: 25px;
            justify-content: center;
        }

        .btn-container {
            grid-column: 2;
            margin-top: 10px;
        }
