:root {
  --about-blue: var(--y-palette-slate);
  --about-deep-blue: var(--y-palette-deep-blue);
  --about-cream: var(--y-color-surface-warm);
  --about-gray: var(--y-palette-muted);
}

.subpage {
  min-height: 100vh;
  background: var(--about-cream);
  color: #000;
}

/* OUR VALUE — Figma 397:140 */
.value {
  position: relative;
  height: 1025px;
  padding: 124px var(--y-layout-page-gutter);
  overflow: hidden;
  background: #fff;
}

.value > .container {
  position: relative;
  z-index: 1;
  display: grid;
  height: 100%;
  grid-template-columns: minmax(0, 816fr) minmax(0, 960fr);
  align-items: stretch;
}

/* Fluid desktop/laptop rules derived from the 1920px Figma canvas. */
@media (min-width: 1025px) and (max-width: 1919px) {
  .value {
    height: calc(100vw * 1025 / 1920);
    min-height: 680px;
    padding: clamp(80px, 6.458333vw, 124px) var(--y-layout-page-gutter);
  }
}

@media (max-width: 1024px) {
  .value {
    height: 760px;
    padding: 80px var(--y-layout-page-gutter);
  }

  .value > .container {
    grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
    gap: 28px;
  }
}

@media (max-width: 768px) {
  .value {
    height: auto;
    min-height: 900px;
    padding: 72px var(--y-layout-page-gutter);
  }

  .value > .container {
    display: flex;
    flex-direction: column;
    gap: 56px;
  }
}

@media (max-width: 390px) {
  .value {
    min-height: 830px;
    padding: 58px var(--y-layout-page-gutter);
  }

  .value > .container {
    gap: 42px;
  }
}

@media (min-width: 1025px) and (max-height: 850px) {
  .value {
    min-height: 660px;
  }
}

/* PRODUCTS — Figma 423:1153. Typography comes only from figma-typography.css. */
.products_main,
.products_main section { width: 100%; }

.products_visual {
  display: flex;
  min-height: 977px;
  padding: 124px var(--y-layout-page-gutter);
  background: var(--renew_surface_primary2);
  overflow: hidden;
}
.products_visual > .container {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 729px;
  align-items: center;
}
.products_visual_copy {
  position: relative;
  z-index: 2;
  display: flex;
  width: min(100%, 553px);
  flex-direction: column;
  gap: 14px;
  color: var(--renew_surface_quaternary);
}
.products_visual_copy > h1,
.products_visual_description p { margin: 0; }
.products_visual_description { width: 553px; max-width: 100%; }
.products_visual_img {
  position: absolute;
  z-index: 1;
  top: 0;
  right: -8px;
  width: min(74.3vw, 1340px);
  height: 754px;
  overflow: hidden;
}
.products_visual_img img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  object-position: center;
}

.products_list {
  padding: 124px var(--y-layout-page-gutter);
  background: var(--renew_txt_color_secondary);
}
.products_list > .container {
  display: grid;
  width: 100%;
  grid-template-columns: 230px minmax(0, 1fr);
  column-gap: clamp(40px, 4.5vw, 88px);
  align-items: start;
}
.products_filter {
  position: sticky;
  top: 120px;
  width: 230px;
  min-width: 0;
}
.products_filter_form {
  display: flex;
  flex-direction: column;
  padding-top: 0;
  gap: 20px;
}
.products_search_wrap {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 230px;
}
.products_search_wrap > label,
.products_filter_group legend,
.products_result_count,
.products_results_title { color: var(--renew_txt_color_point); }
.products_search_field {
  position: relative;
  width: 230px;
  height: 30px;
  border-bottom: 1px solid var(--renew_surface_primary);
}
.products_search_field input {
  width: 100%;
  height: 100%;
  padding: 0 28px 0 0;
  border: 0;
  outline: 0;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  color: var(--renew_txt_color_primary);
}
.products_search_field input::-webkit-search-cancel-button { display: none; }
.products_search_field:focus-within { border-bottom-color: var(--renew_surface_quaternary); }
.products_search_icon {
  position: absolute;
  top: 50%;
  right: 3px;
  width: 14px;
  height: 14px;
  transform: translateY(-55%);
  pointer-events: none;
}
.products_search_icon::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 8px;
  height: 8px;
  border: 1px solid var(--renew_surface_primary);
  border-radius: 50%;
}
.products_search_icon::after {
  content: "";
  position: absolute;
  left: 9px;
  top: 9px;
  width: 5px;
  height: 1px;
  background: var(--renew_surface_primary);
  transform: rotate(45deg);
  transform-origin: left center;
}
.products_filter_group {
  display: flex;
  width: 230px;
  min-width: 0;
  margin: 0;
  padding: 0 0 30px;
  border: 0;
  border-bottom: 1px solid var(--renew_surface_primary);
  flex-direction: column;
  gap: 12px;
}
.products_filter_group legend {
  width: 100%;
  margin: 0 0 18px;
  padding: 0;
}
.products_filter_group label {
  display: flex;
  width: 100%;
  min-width: 0;
  padding-left: 20px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--renew_txt_color_primary);
  cursor: pointer;
}
.products_filter_group input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.products_filter_group label:has(input:checked) > span:first-of-type { color: var(--renew_txt_color_point); }
.products_filter_count { margin-left: auto; color: var(--renew_surface_primary); }
.products_result_count { margin: 0; }

.products_results {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  align-items: center;
}
.products_results_title,
.products_grid,
.products_empty {
  width: min(100%, 1183px);
}
.products_results_title {
  position: static;
  margin: 0 0 44px;
  pointer-events: none;
}
.products_grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 52px;
  row-gap: 96px;
  align-items: start;
}
.products_card[hidden], .products_empty[hidden] { display: none; }
.products_card {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: var(--y-space-24);
}
.products_card_media {
  position: relative;
  display: flex;
  width: min(100%, 282px);
  height: 430px;
  margin: 0 auto;
  align-items: flex-end;
  justify-content: center;
  overflow: visible;
}
.products_card_media > img {
  position: static;
  display: block;
  visibility: visible;
  opacity: 1;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center bottom;
}

.products_card .product_txt {
  width: 100%;
}
.products_empty {
  display: flex;
  min-height: 360px;
  margin: 0 auto;
  align-items: center;
  justify-content: center;
  color: var(--renew_surface_primary);
  text-align: center;
}

@media (max-width: 1919px) {
  .products_visual { min-height: 760px; padding: 110px var(--y-layout-page-gutter) 84px; }
  .products_visual > .container { min-height: 566px; }
  .products_visual_img { width: min(76vw, 1000px); height: 570px; right: -38px; }
  .products_list { padding: 100px var(--y-layout-page-gutter); }
  .products_list > .container { grid-template-columns: 210px minmax(0,1fr); column-gap: clamp(32px, 4vw, 64px); }
  .products_filter, .products_search_wrap, .products_search_field, .products_filter_group { width: 210px; }
  .products_grid { column-gap: 44px; row-gap: 82px; }
}

@media (max-width: 1024px) {
  .products_visual { min-height: 650px; padding: 100px var(--y-layout-page-gutter) 72px; }
  .products_card_media { height: 380px; }
  .products_visual > .container { min-height: 478px; }
  .products_visual_copy { width: 46%; }
  .products_visual_img { width: 68vw; height: 480px; right: -120px; }
  .products_list { padding: 80px var(--y-layout-page-gutter); }
  .products_list > .container { grid-template-columns: 180px minmax(0,1fr); column-gap: 32px; }
  .products_filter, .products_search_wrap, .products_search_field, .products_filter_group { width: 180px; }
  .products_grid { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 34px; row-gap: 72px; }
}

@media (max-width: 768px) {
  .products_visual { min-height: 0; padding: 120px var(--y-layout-page-gutter) 70px; }
  .products_card_media { height: 340px; }
  .products_visual > .container { display: flex; min-height: 0; flex-direction: column; align-items: flex-start; gap: 30px; }
  .products_visual_copy { width: 100%; }
  .products_visual_img { position: relative; top: auto; right: auto; width: 100%; height: auto; aspect-ratio: 16 / 9; }
  .products_list { padding: 72px var(--y-layout-page-gutter); }
  .products_list > .container { display: block; }
  .products_filter { position: static; width: 100%; margin-bottom: 72px; }
  .products_filter_form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px; }
  .products_search_wrap, .products_search_field, .products_filter_group { width: 100%; }
  .products_result_count { grid-column: 1/-1; }
  .products_results { align-items: stretch; }
  .products_results_title { margin-bottom: 32px; }
  .products_grid { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 28px; row-gap: 64px; }
}

@media (max-width: 520px) {
  .products_visual { padding: 108px var(--y-layout-page-gutter) 60px; }
  .products_card_media { height: 320px; }
  .products_list { padding: 64px var(--y-layout-page-gutter); }
  .products_filter { margin-bottom: 60px; }
  .products_filter_form { display: flex; flex-direction: column; gap: 28px; }
  .products_results_title { margin-bottom: 28px; }
  .products_grid { grid-template-columns: minmax(0,1fr); row-gap: 56px; }
  .products_card { width: min(100%, 360px); justify-self: center; }
}

/* Current Figma Value title is cream over the image field. */

@media (min-width: 1920px) {
  /* Our Value — 397:140 */
  .value {
    height: 1025px;
    padding: 124px var(--y-layout-page-gutter);
  }
}

/* ------------------------------------------------------------
   YURIU CURX — temporary page presented as a finished hero
   ------------------------------------------------------------ */
.curx_main {
  width: 100%;
  background: #160b04;
}

.curx_hero {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 100svh;
  align-items: flex-end;
  overflow: hidden;
  background: #160b04;
  color: var(--y-color-surface-warm);
}

.curx_hero_image,
.curx_hero_overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.curx_hero_image {
  object-fit: cover;
  object-position: center;
}

.curx_hero_overlay {
  background: linear-gradient(90deg, rgba(10, 5, 2, .72) 0%, rgba(10, 5, 2, .28) 46%, rgba(10, 5, 2, .05) 72%);
}

.curx_hero_copy {
  position: relative;
  z-index: 1;
  display: flex;
  width: min(760px, 48vw);
  flex-direction: column;
  align-items: flex-start;
  gap: 22px;
  padding: 0 0 clamp(64px, 7.5vw, 144px) var(--y-layout-page-gutter);
}

.curx_hero_title {
  margin: 0;
  font-family: "Playfair", serif;
  font-size: var(--type-display);
  font-weight: 300;
  line-height: .88;
  letter-spacing: -.055em;
}

@media (max-width: 768px) {
  .curx_hero { min-height: 100svh; }
  .curx_hero_image { object-position: 58% center; }
  .curx_hero_overlay { background: linear-gradient(0deg, rgba(10, 5, 2, .82) 0%, rgba(10, 5, 2, .2) 70%); }
  .curx_hero_copy {
    width: 100%;
    gap: 16px;
    padding: 0 var(--y-layout-page-gutter) 72px;
  }
  .curx_hero_title { font-size: var(--type-display); }
}

.products_anchor_targets{position:relative;width:0;height:0;overflow:hidden;}
.products_anchor_targets > span{position:relative;top:calc(-1 * var(--gnb-height, 123px));display:block;width:0;height:0;}

/* Latest Figma products_visual, 985:608. The hero crop and copy are independent
   of the product-list/card layout below it. */
.products_main .products_visual { position:relative; display:block; min-height:0; height:clamp(680px,50.885417vw,977px); padding:0; background:var(--y-color-surface-default); }
.products_main .products_visual > .container { position:static; min-height:0; width:100%; height:100%; }
.products_main .products_visual_img { position:absolute; inset:0; width:100%; height:100%; }
.products_main .products_visual_img img { position:absolute; top:-17.92%; left:.01%; width:123.98%; height:136.02%; object-fit:fill; }
.products_main .products_visual_copy { position:absolute; top:60.184237%; left:var(--y-layout-page-gutter); width:min(553px,40%); gap:var(--y-space-32); color:var(--y-color-text-primary); }
.products_main .products_visual_copy h1 { color:inherit; }
.products_main .products_visual_copy h1 span { font:inherit; color:inherit; }
@media (max-width:768px) {
  .products_main .products_visual { height:720px; }
  .products_main .products_visual_img img { top:0; left:0; width:100%; height:100%; object-fit:cover; object-position:60% center; }
  .products_main .products_visual_copy { top:auto; bottom:var(--y-layout-section-space); width:calc(100% - 2 * var(--y-layout-page-gutter)); gap:var(--y-space-24); }
}
