/* MILESTONE front-end redesign: restrained Infinity-inspired editorial rhythm. */
:root {
  --rd-black: #151515;
  --rd-ink: #242424;
  --rd-paper: #f6f5f2;
  --rd-stone: #e8e5df;
  --rd-rule: #d8d4cc;
  --rd-muted: #5b5955;
  --rd-gold: #ffb000;
  --rd-serif: Georgia, "Noto Serif TC", "Songti TC", serif;
  --header-height: 82px;
}

body { background: var(--rd-paper); color: var(--rd-ink); }
h1, h2, h3 { text-wrap: balance; }
.container { width: min(calc(100% - var(--container-pad) - var(--container-pad)), 1520px); max-width: 1520px; }

/* Navigation */
.site-header,
.site-header.site-header--transparent,
.site-header.is-scrolled,
.site-header:focus-within,
.site-header.is-menu-open {
  min-height: var(--header-height);
  background: var(--rd-black) !important;
  border: 0 !important;
  color: #fff;
  backdrop-filter: none;
}
body.home .site-header.site-header--transparent:not(.is-scrolled):not(:focus-within):not(.is-menu-open) {
  position: absolute;
  left: 0;
  right: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.58), transparent) !important;
  z-index: 80;
}
.site-header__inner { min-height: var(--header-height); gap: clamp(18px, 3vw, 54px); }
.site-brand__text, .custom-logo-link { font-size: 1.15rem; letter-spacing: .13em; font-weight: 600; }
.custom-logo { max-height: 44px; }
.site-header a, .site-header.site-header--transparent a { color: #fff !important; }
.site-navigation { min-width: 0; }
.site-navigation .menu--redesign { display: flex; align-items: stretch; justify-content: flex-end; gap: clamp(13px, 1.55vw, 30px); }
.site-navigation .menu--redesign > li { position: relative; }
.site-navigation .menu--redesign > li > a { min-height: var(--header-height); display: inline-flex; align-items: center; white-space: nowrap; font-size: clamp(.79rem, .75vw, .94rem); letter-spacing: .03em; font-weight: 500; text-decoration: none; border-bottom: 2px solid transparent; }
.site-navigation .menu--redesign > li > a:hover,
.site-navigation .menu--redesign > li:focus-within > a,
.site-navigation .menu--redesign > .current-menu-item > a { border-bottom-color: var(--rd-gold); color: #fff !important; }
.site-navigation .menu-item--studio > a::before { content: ""; width: 5px; height: 5px; margin-right: 7px; border-radius: 50%; background: var(--rd-gold); }
.site-navigation .sub-menu { list-style: none; position: absolute; top: 100%; left: -14px; min-width: 170px; display: none; padding: 10px; margin: 0; background: var(--rd-black); box-shadow: 0 16px 30px #0003; }
.site-navigation .menu-item-has-children:hover .sub-menu,
.site-navigation .menu-item-has-children:focus-within .sub-menu { display: block; }
.site-navigation .sub-menu a { min-height: 38px; display: flex; align-items: center; padding: 4px 9px; font-size: .88rem; text-decoration: none; }
.site-navigation .sub-menu a:hover { background: #303030; }
.site-header__actions { flex: 0 0 auto; }
.site-header .menu-toggle { border: 0; color: #fff; }
.mobile-navigation { background: var(--rd-black); color: #fff; border-top: 1px solid #fff4; }
.mobile-navigation__inner { gap: 20px; }
.mobile-navigation .menu--redesign { display: grid; gap: 0; }
.mobile-navigation .menu--redesign > li { border-bottom: 1px solid #ffffff2a; }
.mobile-navigation .menu--redesign > li > a { display: flex; width: 100%; min-height: 58px; align-items: center; font-size: clamp(1.1rem, 5vw, 1.5rem); text-decoration: none; }
.mobile-navigation .sub-menu { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 16px; padding: 0 0 15px 14px; margin: 0; border-left: 1px solid var(--rd-gold); }
.mobile-navigation .sub-menu a { min-height: 36px; font-size: .9rem; text-decoration: none; }
.site-header .mobile-navigation a { color: #fff !important; }
.site-header .mobile-navigation a:hover { color: var(--rd-gold) !important; }
.site-header .mobile-navigation a.button { width: 100%; max-width: 300px; background: var(--rd-gold); color: var(--rd-black) !important; }

/* Shared editorial primitives */
.rd-section { padding-block: clamp(76px, 8vw, 145px); }
.rd-section__label { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 14px; border-top: 1px solid currentColor; font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.rd-section__heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin: clamp(40px, 6vw, 94px) 0 32px; }
.rd-section__heading h2, .rd-intro h2, .rd-studio h2, .rd-technology h2, .rd-visit h2 { margin: 0; font-family: var(--rd-serif); font-size: clamp(2.65rem, 5vw, 6rem); font-weight: 400; line-height: 1.19; letter-spacing: -.035em; }
.rd-kicker { margin: 0; font-size: .73rem; font-weight: 600; letter-spacing: .2em; }
.rd-link { min-height: 44px; display: inline-flex; align-items: center; justify-content: space-between; gap: 34px; padding: 7px 0; border-bottom: 1px solid currentColor; font-size: .92rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.rd-link span { font-size: 1.1rem; transition: transform .2s ease; }
.rd-link:hover span { transform: translate(3px,-3px); }
.rd-link--light { color: #fff; }
.rd-link--light:hover { color: var(--rd-gold); }

/* Homepage */
.redesign-home { background: var(--rd-paper); }
.rd-hero { position: relative; display: flex; align-items: center; min-height: min(900px, 100svh); color: #fff; background: #302b25; isolation: isolate; }
.rd-hero__image, .rd-hero__shade { position: absolute; inset: 0; z-index: -1; }
.rd-hero__image img { width: 100%; height: 100%; object-fit: cover; }
.rd-hero__shade { background: linear-gradient(90deg, rgba(0,0,0,.68), rgba(0,0,0,.28) 58%, rgba(0,0,0,.1)), linear-gradient(0deg, rgba(0,0,0,.48), transparent 30%); }
.rd-hero__content { padding-top: 90px; padding-bottom: 120px; }
.rd-hero h1 { max-width: 10ch; margin: 25px 0; font-family: var(--rd-serif); font-size: clamp(3.3rem, 7vw, 8.4rem); font-weight: 400; line-height: 1.14; letter-spacing: -.04em; color: #fff; }
.rd-hero__intro { max-width: 34em; color: #fff; font-size: clamp(.95rem, 1.1vw, 1.15rem); line-height: 1.9; }
.rd-hero__actions, .rd-visit__actions { display: flex; flex-wrap: wrap; gap: 24px 42px; margin-top: 38px; }
.rd-hero__bottom { position: absolute; bottom: 26px; left: 0; right: 0; display: flex; justify-content: space-between; font-size: .72rem; letter-spacing: .1em; }
.rd-hero__bottom a { color: #fff; text-decoration: none; }
.rd-intro { display: grid; grid-template-columns: minmax(170px, 1fr) minmax(0, 3fr); gap: 55px; }
.rd-intro .rd-section__label { display: block; }
.rd-intro .rd-section__label span { display: block; margin-bottom: 9px; }
.rd-intro__body { display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; gap: clamp(30px, 4vw, 90px); }
.rd-intro__body p { max-width: 30em; margin: 0 0 25px; font-size: 1.05rem; line-height: 2; color: var(--rd-muted); }
.rd-materials { background: #fff; }
.rd-materials__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 28px); }
.rd-materials__grid .product-card__media { aspect-ratio: 3 / 4; }
.rd-materials__grid .product-card__body { gap: 4px; }
.rd-materials__grid .product-card__title { font-size: clamp(1.18rem, 1.4vw, 1.6rem); }
.rd-materials__grid .product-card__meta { display: none; }
.rd-studio { background: var(--rd-black); color: #fff; }
.rd-studio__top { display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; gap: 60px; margin: clamp(40px, 6vw, 95px) 0 55px; }
.rd-studio__top p { max-width: 27em; margin: 0 0 22px; line-height: 1.9; color: #ddd; }
.rd-scene-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(10px, 1.7vw, 28px); }
.rd-scene { min-width: 0; display: block; color: #fff; text-decoration: none; }
.rd-scene:hover { color: #fff; }
.rd-scene__image { display: block; aspect-ratio: 1.12; background: var(--rd-stone) center / cover no-repeat; overflow: hidden; transition: filter .25s ease; }
.rd-scene:hover .rd-scene__image { filter: brightness(.83); }
.rd-scene--kitchen .rd-scene__image { background-image: url('../images/visualizer/scene-kitchen-20260924.png'); }
.rd-scene--living .rd-scene__image { background-image: url('../images/visualizer/scene-living-20260924.png'); }
.rd-scene--bedroom .rd-scene__image { background-image: url('../images/visualizer/scene-bedroom-20260924.png'); }
.ref-scene.rd-scene--meeting .rd-scene__image,
.ref-scene.rd-scene--living .rd-scene__image,
.ref-scene.rd-scene--dining .rd-scene__image { background-image: none; background-color: #eee; overflow: hidden; }
.ref-scene .rd-scene__image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rd-scene__meta { display: grid; grid-template-columns: 1fr auto; gap: 1px 10px; padding: 16px 0; border-top: 1px solid #ffffff70; }
.rd-scene__meta strong { font-family: var(--rd-serif); font-size: 1.8rem; font-weight: 400; }
.rd-scene__meta > span:nth-child(2) { grid-row: 2; color: #ccc; font-size: .79rem; }
.rd-scene__meta > span:last-child { grid-column: 2; grid-row: 1 / 3; font-size: 1.4rem; }
.rd-project-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 2vw, 32px); }
.rd-project { min-width: 0; display: block; text-decoration: none; }
.rd-project:first-child { grid-column: span 2; }
.rd-project__image { display: block; aspect-ratio: 1.12; overflow: hidden; background: var(--rd-stone); }
.rd-project:first-child .rd-project__image { aspect-ratio: 1.65; }
.rd-project__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.rd-project:hover img { transform: scale(1.025); }
.rd-project__title { display: flex; justify-content: space-between; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--rd-rule); font-size: .94rem; }
.rd-technology { background: var(--rd-stone); }
.rd-technology__inner { display: grid; grid-template-columns: 1.4fr .6fr; gap: 70px; }
.rd-technology h2 { margin-top: 80px; max-width: 10ch; }
.rd-technology__inner > div:last-child { align-self: end; }
.rd-technology p { max-width: 29em; line-height: 2; color: var(--rd-muted); }
.rd-visit { background: #312d29; color: #fff; }
.rd-visit h2 { margin: 40px 0 25px; color: #fff; }
.rd-visit p:not(.rd-kicker) { color: #e1ded9; }

/* Material archive */
.site-main.product-archive-main { padding: 0 0 110px; background: #fff; }
.product-archive-hero.container { position: relative; width: 100%; max-width: none; min-height: clamp(420px, 44vw, 650px); display: flex; align-items: end; padding: 140px max(4vw, calc((100vw - 1440px)/2)) 65px; margin: 0 0 55px; color: #fff; background: #3d3933; isolation: isolate; }
.product-archive-hero__image { position: absolute; inset: 0; z-index: -2; }
.product-archive-hero__image img { width: 100%; height: 100%; object-fit: cover; }
.product-archive-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#0009,#0002), linear-gradient(0deg,#0008,transparent 75%); }
.product-archive-hero__content { max-width: 850px; }
.product-archive-hero .eyebrow { color: #fff; }
.product-archive-hero h1 { max-width: none; margin: 10px 0 14px; color: #fff; font-family: var(--rd-serif); font-weight: 400; font-size: clamp(3.5rem, 7vw, 7.5rem); line-height: 1.1; }
.product-archive-hero p:not(.eyebrow) { max-width: 34em; color: #fff; }
.product-catalogue-layout.container { max-width: 1440px; display: grid; grid-template-columns: 250px minmax(0,1fr); gap: 35px; }
.product-discovery-panel.container { display: block; width: 100%; max-width: none; margin-bottom: 0; border: 0; padding: 0 0 35px; background: transparent; box-shadow: none; clip-path: none; }
.product-discovery-panel__summary { display: none; }
.product-filter { display: block; }
.product-filter__toggle { align-self: start; border: 0; border-top: 1px solid var(--rd-black); border-bottom: 1px solid var(--rd-rule); padding: 16px 0; background: transparent; font-size: .95rem; }
.product-filter__form { gap: 14px; padding-top: 14px; }
.product-catalogue-sidebar .product-filter__grid { grid-template-columns: 1fr; gap: 12px; }
.product-catalogue-sidebar .product-filter__group select,
.product-catalogue-sidebar .product-filter__group input { width: 100%; }
.product-filter__group label { display: block; margin: 0 0 5px; color: var(--rd-muted); font-size: .76rem; }
.product-filter__group select, .product-filter__group input { min-height: 44px; border: 1px solid var(--rd-rule); background: #fff; font-size: .86rem; }
.product-filter__advanced summary { font-size: .78rem; color: var(--rd-muted); }
.product-filter__actions .button { min-height: 42px; width: 100%; border-radius: 0; font-size: .79rem; }
.product-filter__actions .button--primary { background: var(--rd-black); color: #fff !important; }
.product-filter__actions .button--secondary { color: var(--rd-black); }
.product-active-filters.container { max-width: none; padding: 0; margin-bottom: 28px; }
.product-results { min-width: 0; }
.product-results__heading { padding-bottom: 14px; }
.product-results__heading h2 { font-size: 1.25rem; font-family: var(--rd-serif); font-weight: 400; }
.product-results > .product-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 44px 18px; }
.product-card__media { aspect-ratio: 3/4; background: #f0eeea; }
.product-card__body { gap: 3px; }
.product-card .card-meta { font-size: .72rem; color: var(--rd-muted); }
.product-card__title { font-family: var(--rd-serif); font-weight: 400; font-size: clamp(1.24rem, 1.5vw, 1.65rem); }
.product-card__subtitle, .product-card__meta { font-size: .75rem; }

/* Product detail */
.product-single-main { padding: 30px 0 100px; background: var(--rd-paper); }
.product-single .breadcrumb { margin-bottom: 20px; }
.product-hero.container { min-height: 0; max-width: 1440px; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: clamp(40px, 6vw, 100px); padding-block: 28px 60px; margin-bottom: 10px; }
.product-hero__content { gap: 18px; }
.product-hero h1 { max-width: 12ch; font-family: var(--rd-serif); font-size: clamp(3rem, 5vw, 6.3rem); font-weight: 400; line-height: 1.12; }
.product-hero__en { font-family: var(--rd-serif); font-size: clamp(1.15rem, 2vw, 2rem); }
.product-hero__media { aspect-ratio: 1.15; background: #ebe8e2; }
.product-hero__media img { object-fit: contain; }
.product-hero__meta span { background: transparent; border: 0; border-bottom: 1px solid var(--rd-rule); border-radius: 0; padding-inline: 0; margin-right: 15px; }
.product-hero .button-row { margin-top: 12px; }
.product-hero .button { border-radius: 0; font-size: .8rem; }
.product-hero .button--studio { background: var(--rd-gold); border-color: var(--rd-black); color: var(--rd-black); }
.product-hero .button--studio:hover { background: #e8a200; color: var(--rd-black); }
.product-hero .button--primary { background: var(--rd-black); color: #fff !important; }
.product-single__body.container { max-width: 1440px; }
.product-detail-section { border-top-color: var(--rd-rule); }
.product-detail-summary__title, .product-detail-section h2 { font-family: var(--rd-serif); font-weight: 400; }

/* 3D studio surface and controls */
.studio-page { padding: 48px 4vw 100px; background: var(--rd-paper); }
.studio-heading { max-width: 1440px; margin-bottom: 32px; align-items: end; }
.studio-heading h1 { font-family: var(--rd-serif); font-size: clamp(2.7rem, 4.5vw, 5.4rem); line-height: 1.15; }
.studio-heading > a { text-decoration: none; border-bottom: 1px solid; }
.studio-layout { max-width: 1440px; grid-template-columns: minmax(0,1fr) 365px; gap: 0; border: 1px solid var(--rd-rule); }
.studio-stage { background: #e6e2dc; }
#studio-canvas { background: #e5e1da; }
.studio-scenes { top: 18px; left: 18px; border-radius: 0; box-shadow: 0 3px 15px #0001; }
.studio-page button { border-radius: 0; }
.studio-page button[aria-pressed="true"],
.studio-materials .studio-swatch[aria-pressed="true"] { background: var(--rd-gold); color: var(--rd-black); border-color: var(--rd-black); }
.studio-controls { border-top: 1px solid #d3cfc7; background: #eae7e1; }
.studio-wall-tones { background: #eae7e1; }
.studio-wall-tones button[aria-pressed="true"] { background: var(--rd-gold); }
.studio-gesture { color: var(--rd-muted); background: #eae7e1; }
.studio-panel { border-left: 1px solid var(--rd-rule); }
.studio-panel .eyebrow { color: var(--rd-muted); }
.studio-materials { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; max-height: 290px; }
.studio-swatch img { height: 75px; object-fit: contain; background: #f1efec; }
.studio-variant-section { border-top-color: var(--rd-rule); }
.studio-page .studio-cta { background: var(--rd-black); color: #fff !important; border: 1px solid var(--rd-black); }
.studio-page .studio-cta:hover { background: var(--rd-gold); color: var(--rd-black) !important; }
.studio-page .studio-panel-heading button { color: var(--rd-ink); }

/* Footer */
.site-footer { border-top: 0; background: var(--rd-black); }
.site-footer__name { font-family: var(--rd-serif); font-size: clamp(2rem, 3vw, 3.2rem); font-weight: 400; letter-spacing: .1em; }
.site-footer .menu--redesign { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 18px; }
.site-footer .menu--redesign > li { list-style: none; }
.site-footer .menu--redesign > li > a { min-height: 38px; font-size: .82rem; }
.site-footer .sub-menu { display: none; }
.site-footer a:hover { color: var(--rd-gold); }

@media (max-width: 1199px) {
  .site-navigation { display: none; }
  .menu-toggle { display: inline-flex; }
  .mobile-navigation:not([hidden]) { display: block; }
}
@media (min-width: 1200px) {
  .site-navigation { display: block; flex: 1 1 auto; }
  .menu-toggle { display: none; }
  .mobile-navigation { display: none !important; }
}
@media (max-width: 1000px) {
  .rd-intro, .rd-intro__body, .rd-studio__top, .rd-technology__inner { grid-template-columns: 1fr; }
  .rd-intro { gap: 32px; }
  .rd-intro__body, .rd-studio__top { gap: 24px; }
  .rd-technology h2 { margin-top: 40px; }
  .rd-materials__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .product-catalogue-layout.container { display: block; }
  .product-results > .product-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .product-filter__grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .product-hero.container { grid-template-columns: 1fr 1fr; }
  .studio-layout { grid-template-columns: 1fr; }
  .studio-panel { border-left: 0; border-top: 1px solid var(--rd-rule); }
}
@media (max-width: 700px) {
  :root { --header-height: 68px; }
  .rd-section { padding-block: 70px; }
  .rd-section__heading { display: block; margin: 38px 0 26px; }
  .rd-section__heading .rd-link { margin-top: 24px; }
  .rd-section__heading h2, .rd-intro h2, .rd-studio h2, .rd-technology h2, .rd-visit h2 { font-size: clamp(2.55rem, 10vw, 4rem); }
  .rd-hero { min-height: 92svh; }
  .rd-hero__content { padding-top: 125px; padding-bottom: 120px; }
  .rd-hero h1 { font-size: clamp(3.2rem, 13vw, 5rem); }
  .rd-hero__shade { background: linear-gradient(90deg,#000a,#0006),linear-gradient(0deg,#0008,transparent 35%); }
  .rd-hero__bottom { bottom: 20px; }
  .rd-studio__top { margin: 35px 0; }
  .rd-scene-grid, .rd-project-grid { grid-template-columns: 1fr; }
  .rd-scene__image { aspect-ratio: 1.35; }
  .rd-project:first-child { grid-column: auto; }
  .rd-project:first-child .rd-project__image { aspect-ratio: 1.12; }
  .rd-materials__grid { gap: 25px 12px; }
  .rd-materials__grid .product-card__media { aspect-ratio: .8; }
  .product-archive-hero.container { min-height: 420px; padding: 130px 20px 48px; }
  .product-archive-hero h1 { font-size: 3.6rem; }
  .product-filter__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .product-results > .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 30px 12px; }
  .product-single-main { padding-top: 18px; }
  .product-hero.container { display: flex; flex-direction: column-reverse; gap: 28px; }
  .product-hero__media { width: 100%; aspect-ratio: 1.05; }
  .product-hero h1 { font-size: clamp(2.9rem, 12vw, 4.8rem); }
  .studio-page { padding: 32px 16px 70px; }
  .studio-heading h1 { font-size: 2.9rem; }
  .studio-stage { position: relative; top: auto; }
  #studio-canvas { height: 330px; }
  .studio-materials { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .site-footer .menu--redesign { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 420px) {
  .rd-hero h1 { font-size: 3.05rem; }
  .rd-hero__actions { gap: 12px 24px; }
  .rd-hero__bottom { font-size: .62rem; }
  .rd-materials__grid .product-card__title { font-size: 1.12rem; }
  .product-filter__grid { grid-template-columns: 1fr; }
  .studio-page { padding-inline: 0; }
  .studio-heading { padding-inline: 20px; }
  .studio-layout { border-inline: 0; }
  .studio-materials { grid-template-columns: repeat(3,minmax(0,1fr)); }
  #studio-canvas { height: 280px; }
}
@media (prefers-reduced-motion: reduce) {
  .rd-link span, .rd-scene__image, .rd-project__image img { transition: none; }
}
