@charset "utf-8";
    /* ============================
       LOOKS – CSS
    ============================ */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --looks-bg: #f0ede8;
      --looks-dark: #1a1a18;
      --looks-mid: #7a7568;
      --looks-gold: #b89a5e;
      --looks-btn-bg: #1a1a18;
      --looks-btn-text: #f0ede8;
      --looks-radius: 0px;
      --looks-transition: 0.45s cubic-bezier(.77,0,.18,1);
    }

    .looks-section {
      /*background: var(--looks-bg);*/
		background-color: #F2F1EF;
      padding: 60px 20px 80px;
      font-family: 'Jost', sans-serif;
    }

    /* Header */
    .looks-header {
      text-align: center;
      margin-bottom: 48px;
    }
    .looks-header__eyebrow {
      font-family: 'Poppins';
      font-size: 21px;
      font-weight: 400;
      letter-spacing: 0;
      color: #2D2D2D;
      text-transform: uppercase;
      margin-bottom: 10px;
    }
    .looks-header__title {
      font-family: 'Sitka Text', Georgia, serif;
      font-size: 42px;
      font-weight: 400;
      color: #2D2D2D;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      line-height: 1;
    }

    /* Wrapper */
    .looks-wrapper {
      position: relative;
      max-width: 1200px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      padding: 0 92px 0 152px;
      gap: 0;
    }

    /* Arrow buttons */
    .looks-arrow {
      flex-shrink: 0;
      width: 52px;
      height: 52px;
      border-radius: 50%;
      border: 0;
      background: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      z-index: 10;
      box-shadow: 0 0 0 1px rgba(45, 45, 45, 0.05);
      transition: background 0.2s, transform 0.2s;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
    }
    .looks-arrow:hover { background: var(--looks-dark); transform: translateY(-50%) scale(1.03); }
    .looks-arrow:hover svg { stroke: #fff; }
    .looks-arrow svg { width: 16px; height: 16px; stroke: var(--looks-dark); fill: none; stroke-width: 1.8; transition: stroke 0.2s; }
    .looks-arrow--prev { left: 0; }
    .looks-arrow--next { right: 0; }

    /* Inner layout */
    .looks-inner {
      display: flex;
      align-items: center;
      width: 100%;
      gap: 52px;
      overflow: hidden;
    }

    /* Image side */
    .looks-image-wrap {
      flex: 0 0 auto;
      width: 52%;
      max-width: 520px;
      overflow: hidden;
      position: relative;
    }
    .looks-image-wrap img {
      width: 100%;
      display: block;
      object-fit: cover;
      aspect-ratio: 3/4;
      transition: transform 0.6s ease, opacity 0.4s ease;
    }

    /* Product side */
    .looks-product-wrap {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      padding: 20px 0;
      min-width: 0;
    }

    .looks-slide {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      opacity: 1;
      transform: translateX(0);
      transition: opacity var(--looks-transition), transform var(--looks-transition);
    }
    .looks-slide.exit-left  { opacity: 0; transform: translateX(-30px); }
    .looks-slide.exit-right { opacity: 0; transform: translateX(30px); }
    .looks-slide.enter-left  { opacity: 0; transform: translateX(30px); }
    .looks-slide.enter-right { opacity: 0; transform: translateX(-30px); }

    .looks-badge {
      width: min(100%, 260px);
      align-self: center;
      font-size: 14px;
      font-weight: 400;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: #2D2D2D;
      margin: 0 auto 32px;
      text-align: left;
      font-family: 'Poppins';
    }

    .looks-product-img-wrap {
      width: 214px;
      height: 214px;
      background: none;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 30px;
      overflow: hidden;
    }
    .looks-product-img-wrap img {
      width: 85%;
      height: 85%;
      object-fit: contain;
      transition: transform 0.4s ease;
    }
    .looks-product-img-wrap:hover img { transform: scale(1.05); }

    .looks-product-name {
      font-family: 'Jost', sans-serif;
      font-size: 13px;
      font-weight: 400;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--looks-dark);
      margin: 0 auto 6px;
      max-width: 320px;
      line-height: 1.55;
      text-align: center;
    }
    .looks-product-price {
      font-family: 'Jost', sans-serif;
      font-size: 15px;
      color: #2D2D2D;
      letter-spacing: 0;
      margin: 0 auto 28px;
      text-align: center;
    }

    .looks-btn {
      display: inline-block;
      background-color: #2D2D2D;
	
      color: #fff;
      font-family: 'Poppins';
      font-size: 14px;
      font-weight: 400;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      padding: 15px 32px;
      text-decoration: none;
      cursor: pointer;
      border: none;
      transition: background 0.25s, color 0.25s;
      margin: 0 auto 20px;
    }
    .looks-btn:hover { background-color: #C0C0C0;
		color: #2D2D2D;
}

    /* Dots */
    .looks-dots {
      display: flex;
      gap: 10px;
      align-items: center;
      justify-content: center;
      margin: 0 auto;
    }
    .looks-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #bdb7ae;
      cursor: pointer;
      transition: background 0.2s, transform 0.2s;
    }
    .looks-dot.active { background: var(--looks-dark); transform: scale(1.12); }

    /* ========================
       RESPONSIVE
    ======================== */
    @media (max-width: 768px) {
      .looks-section { padding: 40px 16px 60px; }

      .looks-inner {
        flex-direction: column;
        gap: 28px;
      }
      .looks-image-wrap {
        width: 100%;
        max-width: 100%;
      }
      .looks-product-wrap {
        align-items: center;
        text-align: center;
        padding: 0;
        width: 100%;
      }
      .looks-product-img-wrap {
        margin-left: auto;
        margin-right: auto;
      }
      .looks-dots {
        justify-content: center;
      }
      .looks-badge {
        width: 100%;
        text-align: center;
      }
      .looks-product-img-wrap {
        width: 160px;
        height: 160px;
      }
      .looks-arrow--prev { left: 0; }
      .looks-arrow--next { right: 0; }
      .looks-wrapper { padding: 0 58px; }
    }

    @media (max-width: 480px) {
      .looks-arrow { width: 36px; height: 36px; }
      .looks-arrow--prev { left: -4px; }
      .looks-arrow--next { right: -4px; }
    }