/* エディトリアル・シネマヒーロー（kwac-factory / interior-contest 共有）。正本: このファイル。HTML は <link href=".../css/kwac-editorial-skin.css"> のみ。 */
:root {
  --black: #0a0a0a;
  --white: #faf8f3;
  --page-white: #ffffff;
  --gray-100: #ede9e1;
  --gray-200: #e0dbd2;
  --gray-300: #bfb9b0;
  --gray-500: #6e6860;
  --gray-700: #2f2c28;
  --accent: #a87f4d;
  --nav-height: 68px;
  --font-display: 'Cormorant Garamond', Georgia, 'Hiragino Mincho ProN', 'Yu Mincho', serif;
  --font-body: 'Jost', 'Helvetica Neue', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', 'Yu Gothic UI', 'Yu Gothic', Meiryo, sans-serif;
  --font-ui: 'Manrope', 'Jost', 'Hiragino Kaku Gothic ProN', 'Yu Gothic UI', sans-serif;
  --pad: 80px;
  --type-body: clamp(13px, 1.05vw, 15px);
  --type-body-sm: clamp(12px, 0.95vw, 14px);
  --type-meta: clamp(10px, 0.78vw, 11px);
  --leading-snug: 1.65;
  --leading-body: 1.88;
  --leading-relaxed: 2;
  --image-max: min(1680px, 100vw - 2 * max(1rem, min(3vw, 2rem)));
  --section-wide: min(1680px, 100vw - 2 * max(1rem, min(3vw, 2rem)));
  --text-measure: 58em;
  --text-tight: 40em;
  --editorial-y: clamp(56px, 7vw, 120px);
  --editorial-x: clamp(20px, 5vw, 64px);
}
body {
  background: var(--white) !important;
  font-family: var(--font-body) !important;
  font-weight: 300 !important;
  color: var(--gray-700) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern" 1, "liga" 1;
  line-height: var(--leading-body);
  padding-top: var(--nav-height) !important;
  letter-spacing: 0.03em;
}
.navbar,.navbar-default,.navbar-fixed-top,.navbar-collapse,.navbar-header { display: none !important; }
.product-page-style h1:not(.pps-hero__title),
.product-page-style h2:not(.pps-film__title),
.product-page-style h3 {
  font-family: var(--font-display) !important;
  font-weight: 300 !important;
  letter-spacing: 0.1em;
  color: var(--black) !important;
}
p, li, td, th { font-family: var(--font-body) !important; line-height: 1.88; }
a, a:link, a:visited { color: var(--gray-700); text-decoration: none; }
a:hover { color: var(--accent); opacity: 1; }
img { display: block; max-width: 100%; height: auto; }

/* プロジェクトページ — 今どきミニマル */
.kwac-page { padding: 0 var(--pad); box-sizing: border-box; max-width: 960px; margin: 0 auto; }
.kwac-title { font-size: clamp(1.75rem, 3vw, 2.25rem); margin: 0 0 0.5rem; }
.kwac-lead { font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray-500); margin: 0 0 3rem; }
.kwac-intro { font-size: 1rem; line-height: 1.9; margin: 0 0 3rem; color: var(--gray-700); }
.kwac-section { margin-bottom: 3.5rem; }
.kwac-section-title { font-size: 0.65rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--accent); margin: 0 0 1.25rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--gray-100); }
.kwac-section p { margin: 0 0 1rem; }
.kwac-figures { display: grid; gap: 2rem; margin: 1.5rem 0; }
.kwac-figures img { width: 100%; }
.kwac-before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin: 1.5rem 0; }
.kwac-before-after img { width: 100%; }
.kwac-sub { font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gray-500); margin: 1.5rem 0 0.75rem; }
.kwac-video { position: relative; width: 100%; padding-bottom: 56.25%; height: 0; overflow: hidden; margin: 1.5rem 0; }
.kwac-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.kwac-cta { text-align: center; margin: 3rem 0; padding: 2rem 0; border-top: 1px solid var(--gray-100); }
.kwac-cta a { font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--accent); }
.kwac-cta a:hover { text-decoration: underline; }

/* ========== Product Page Style (pps) — editorial + cinematic ========== */
.product-page-style {
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden;
  box-sizing: border-box;
  background: var(--white);
}
.product-page-style * { box-sizing: border-box; }
.pps-hero { position: relative; width: 100%; min-height: 88vh; min-height: 100dvh; display: flex; align-items: center; justify-content: center; overflow: hidden; box-sizing: border-box; }
.pps-hero--cinema { isolation: isolate; }
.pps-hero__media { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.pps-hero__bg {
  --parallax-y: 0px;
  position: absolute;
  left: -4%;
  top: -3%;
  width: 108%;
  height: 106%;
  background-size: cover;
  background-position: center 40%;
  background-repeat: no-repeat;
  will-change: transform;
  transform: translate3d(0, var(--parallax-y), 0) scale(1.02);
  transition: transform 0.2s ease-out;
}
.pps-hero__img { position: absolute; inset: 0; background-size: cover; background-position: center; background-repeat: no-repeat; }
.pps-hero__overlay {
  position: absolute; inset: 0; z-index: 1;
  background:
    radial-gradient(ellipse 95% 75% at 50% 32%, rgba(8, 8, 8, 0) 0%, rgba(8, 8, 8, 0.28) 50%, rgba(8, 8, 8, 0.62) 100%),
    linear-gradient(180deg, rgba(8, 8, 8, 0.18) 0%, rgba(8, 8, 8, 0.38) 42%, rgba(8, 8, 8, 0.55) 100%);
  pointer-events: none;
}
.pps-hero__content { position: relative; z-index: 2; text-align: center; padding: clamp(48px, 10vh, 100px) max(var(--pad), min(4vw, 1.5rem)) clamp(40px, 8vh, 72px); max-width: min(72rem, 98vw); margin: 0 auto; }
.pps-hero__inner { display: flex; flex-direction: column; align-items: center; gap: clamp(18px, 2.5vw, 28px); }
.pps-hero__eyebrow {
  font-family: var(--font-ui) !important;
  font-size: var(--type-meta) !important;
  font-weight: 500 !important;
  letter-spacing: 0.52em !important;
  text-transform: uppercase;
  color: rgba(232, 214, 188, 0.95) !important;
  margin: 0 !important;
  text-shadow: 0 1px 20px rgba(0,0,0,0.45);
}
.pps-hero__title {
  font-family: var(--font-display) !important;
  font-size: clamp(34px, 6.2vw, 76px) !important;
  font-weight: 200 !important;
  letter-spacing: 0.26em !important;
  color: #fffcf7 !important;
  margin: 0 !important;
  line-height: 1.06 !important;
  text-transform: uppercase;
  text-shadow: 0 6px 56px rgba(0,0,0,0.5), 0 0 1px rgba(0,0,0,0.9);
  text-wrap: balance;
}
.pps-hero__title::after { content: ""; display: block; width: min(72px, 18vw); height: 1px; margin: clamp(20px, 2.5vw, 28px) auto 0; background: linear-gradient(90deg, transparent, rgba(184,149,106,0.95), transparent); opacity: 0.9; }
.pps-hero__sub {
  font-family: var(--font-body) !important;
  font-size: clamp(12.5px, 1.18vw, 15px) !important;
  font-weight: 300 !important;
  letter-spacing: 0.09em !important;
  color: rgba(252, 249, 242, 0.97) !important;
  margin: 0 auto !important;
  /* Japanese measure: tune via --hero-sub-max (set by gallery-to-kwac-editorial.js) */
  max-width: min(var(--hero-sub-max, 52ch), 96vw);
  text-transform: none;
  line-height: var(--leading-relaxed);
  text-shadow: 0 1px 2px rgba(0,0,0,0.45), 0 6px 32px rgba(0,0,0,0.35);
  text-wrap: balance;
  display: block;
  overflow: visible;
}

/* Long hero copy: widen readable measure + relax clamp (hooked via JS classes on gallery conversion pages). */
.pps-hero__content.hero-text--sub-medium { max-width: min(84rem, 98vw); }
.pps-hero__content.hero-text--sub-long { max-width: min(92rem, 98vw); }

.pps-hero__sub.pps-hero__sub--medium {
  /* Width is primarily controlled by --hero-sub-max; keep this as a gentle upper bound */
  max-width: min(var(--hero-sub-max, 52ch), 98vw);
}
.pps-hero__sub.pps-hero__sub--long {
  max-width: min(var(--hero-sub-max, 62ch), 98vw);
}

/* Short subtitles: prefer a single line on large screens (mobile still wraps if needed). */
@media (min-width: 980px) {
  .pps-hero__sub[data-hero-single="1"] {
    white-space: nowrap;
  }
}

/* Very long titles: slightly reduce headline dominance for readability */
.pps-hero__title.pps-hero__title--long {
  font-size: clamp(28px, 5.6vw, 68px) !important;
  letter-spacing: 0.18em !important;
}
.pps-hero__scroll { position: absolute; bottom: clamp(20px, 4vw, 40px); left: 50%; transform: translateX(-50%); z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 8px; pointer-events: none; opacity: 0.55; }
.pps-hero__scroll span { font-family: var(--font-ui); font-size: 9px; font-weight: 500; letter-spacing: 0.4em; text-transform: uppercase; color: rgba(247,245,242,0.65); }
.pps-hero__scroll::after { content: ""; width: 1px; height: 36px; background: linear-gradient(180deg, var(--accent), transparent); }
@media (max-width: 768px) {
  .pps-hero__bg { background-attachment: scroll !important; left: -4%; width: 108%; }
  .pps-hero__title { letter-spacing: 0.14em !important; }
}
@media (prefers-reduced-motion: reduce) {
  .pps-hero__bg { transform: none !important; transition: none !important; }
  .pps-cta a:hover { transform: none; }
}
.pps-concept {
  background: radial-gradient(ellipse 120% 80% at 50% 0%, rgba(40, 36, 32, 0.55) 0%, #080808 45%);
  color: #c9c3b8;
  padding: clamp(80px, 14vw, 140px) max(var(--pad), min(6vw, 5rem));
  position: relative;
}
.pps-concept::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(184, 149, 106, 0.45), transparent);
}
.pps-concept > * { max-width: var(--text-measure); margin-left: auto; margin-right: auto; }
/* Concept label only: align to the left edge of section padding */
.pps-concept > .pps-label {
  max-width: none;
  margin-left: 0;
  margin-right: auto;
}
.pps-label {
  display: block;
  font-family: var(--font-ui) !important;
  font-size: var(--type-meta) !important;
  font-weight: 500 !important;
  letter-spacing: 0.34em !important;
  text-transform: uppercase !important;
  color: rgba(200, 178, 148, 0.95) !important;
  margin-bottom: clamp(22px, 3.2vw, 36px) !important;
}
.pps-concept .pps-label {
  padding-left: 16px;
  border-left: 2px solid rgba(184, 149, 106, 0.5);
  text-align: left;
}
.pps-concept__pull {
  font-family: var(--font-display) !important;
  font-size: clamp(22px, 3.2vw, 34px) !important;
  font-weight: 300 !important;
  font-style: italic;
  line-height: 1.42 !important;
  letter-spacing: 0.02em !important;
  color: #f7f4ef !important;
  margin: 0 0 clamp(28px, 4.5vw, 40px) !important;
  padding-bottom: clamp(22px, 3.2vw, 32px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  text-wrap: balance;
}
.pps-concept__body {
  font-size: var(--type-body) !important;
  line-height: var(--leading-relaxed) !important;
  letter-spacing: 0.045em !important;
  margin: 0 0 1.35em !important;
  color: rgba(224, 218, 208, 0.96) !important;
}
.pps-concept__body:last-of-type { margin-bottom: 0; }
.pps-concept__cta {
  font-size: var(--type-body-sm) !important;
  letter-spacing: 0.05em !important;
  line-height: 1.92 !important;
  margin: clamp(28px, 5vw, 40px) 0 0 !important;
  padding-top: clamp(24px, 4vw, 32px);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(200, 194, 184, 0.95) !important;
}
.pps-concept__cta a { color: var(--accent) !important; border-bottom: 1px solid rgba(184, 149, 106, 0.35); padding-bottom: 2px; transition: border-color 0.2s, opacity 0.2s; }
.pps-concept__cta a:hover { opacity: 1; border-bottom-color: var(--accent); text-decoration: none; }
.pps-label--on-light {
  font-family: var(--font-ui) !important;
  color: var(--gray-700) !important;
  font-size: var(--type-meta) !important;
  font-weight: 600 !important;
  letter-spacing: 0.22em !important;
  margin-bottom: clamp(14px, 2.2vw, 20px) !important;
  padding: 0 0 12px 14px;
  border-bottom: none;
  border-left: 2px solid var(--accent);
  position: relative;
  max-width: var(--image-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: left;
}
.pps-label--on-light::after { display: none; }
.pps-prose {
  font-size: var(--type-body);
  line-height: var(--leading-relaxed);
  letter-spacing: 0.04em;
  color: var(--gray-700);
  margin: clamp(14px, 2.2vw, 22px) auto 0;
  max-width: min(var(--text-measure), 58em);
}
.pps-prose--tight { margin-top: 8px; }
.pps-prose--section {
  margin: 0 auto clamp(8px, 2vw, 16px);
  color: var(--gray-700);
}
/* —— 改修内容・外装/内装：幅広エディトリアル —— */
.pps-section--editorial {
  position: relative;
  padding: var(--editorial-y) var(--editorial-x) !important;
  max-width: none;
  background: linear-gradient(180deg, #fcfaf6 0%, #f5f0e6 12%, #faf7f0 100%);
  border-top: none !important;
  box-shadow: inset 0 1px 0 rgba(0,0,0,0.04);
}
.pps-section--editorial::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, rgba(168,127,77,0.5) 20%, var(--accent) 50%, rgba(168,127,77,0.5) 80%, transparent 100%);
  opacity: 0.6;
  pointer-events: none;
}
.pps-chapter {
  width: 100%;
  max-width: var(--section-wide);
  margin: 0 auto clamp(40px, 5vw, 64px);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(20px, 2.5vw, 32px);
}
.pps-chapter__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.6rem 1.5rem;
  border-left: 3px solid var(--accent);
  padding: 0 0 0 clamp(16px, 2vw, 24px);
}
.pps-chapter__en {
  font-family: var(--font-ui) !important;
  font-size: var(--type-meta) !important;
  font-weight: 600 !important;
  letter-spacing: 0.32em !important;
  text-transform: uppercase;
  color: var(--gray-500) !important;
  margin: 0 !important;
}
.pps-chapter h2.pps-chapter__ja {
  font-family: var(--font-display) !important;
  font-size: clamp(1.5rem, 2.6vw, 2.5rem) !important;
  font-weight: 300 !important;
  letter-spacing: 0.18em !important;
  color: var(--black) !important;
  margin: 0 !important;
  line-height: 1.25 !important;
  text-transform: none !important;
}
.pps-chapter__lead {
  font-size: clamp(14px, 1.2vw, 16px) !important;
  line-height: 1.95 !important;
  letter-spacing: 0.04em !important;
  color: var(--gray-700) !important;
  margin: 0 !important;
  max-width: min(64em, 100%) !important;
}
.pps-prose--editorial {
  max-width: min(64em, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: justify;
  text-justify: inter-ideograph;
}
.pps-prose--editorial + * { margin-top: clamp(28px, 3.5vw, 48px) !important; }
.pps-content-matrix {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 1.5vw, 24px);
  max-width: var(--section-wide);
  margin: 0 auto;
}
.pps-content-matrix__item {
  position: relative;
  padding: clamp(24px, 2.2vw, 32px) clamp(20px, 1.8vw, 28px) clamp(28px, 2.5vw, 36px);
  background: var(--page-white);
  border: 1px solid rgba(0,0,0,0.07);
  box-shadow: 0 20px 50px -30px rgba(0,0,0,0.2), 0 0 0 1px rgba(255,255,255,0.8) inset;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-height: 100%;
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.pps-content-matrix__item:hover {
  transform: translateY(-4px);
  box-shadow: 0 28px 60px -28px rgba(0,0,0,0.18), 0 0 0 1px rgba(168,127,77,0.2) inset;
}
.pps-content-matrix__num {
  font-family: var(--font-ui);
  font-size: clamp(2rem, 2.4vw, 2.5rem);
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.08em;
  color: rgba(168, 127, 77, 0.4);
  margin: 0 0 0.15em;
}
.pps-content-matrix__title {
  font-family: var(--font-ui) !important;
  font-size: clamp(12px, 0.9vw, 13px) !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  line-height: 1.4 !important;
  color: var(--black) !important;
  margin: 0 !important;
}
.pps-content-matrix__text {
  font-size: var(--type-body-sm);
  line-height: var(--leading-snug);
  letter-spacing: 0.04em;
  color: var(--gray-500);
  margin: 0 !important;
  flex: 1;
}
.pps-figure-pair {
  max-width: var(--section-wide);
  margin: clamp(28px, 3vw, 40px) auto 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
  align-items: start;
  background: var(--black);
  box-shadow: 0 24px 80px -32px rgba(0,0,0,0.25);
  overflow: hidden;
}
.pps-figure-pair__cell {
  position: relative;
  margin: 0;
  background: #111;
  align-self: start;
}
.pps-figure-pair__cell img {
  width: 100%;
  height: auto !important;
  display: block;
  object-fit: contain;
  object-position: top center;
}
.pps-figure-pair__label {
  position: absolute;
  z-index: 2;
  top: clamp(12px, 1.5vw, 20px);
  left: clamp(12px, 1.5vw, 20px);
  font-family: var(--font-ui);
  font-size: var(--type-meta);
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #fefdfb !important;
  padding: 8px 14px;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 2px;
  margin: 0 !important;
  box-shadow: none;
}
.pps-figure-pair + .pps-prose--editorial { margin-top: clamp(28px, 3.5vw, 44px) !important; }
.pps-figure--editorial { max-width: var(--section-wide) !important; margin-left: auto !important; margin-right: auto !important; }
.pps-sub--row { display: table; max-width: var(--section-wide); margin: clamp(12px, 1.5vw, 18px) auto 0; }
.pps-sub--on-dark {
  background: rgba(0,0,0,0.7) !important;
  color: #f0ebe3 !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  box-shadow: none;
}
.pps-before-after--editorial {
  max-width: var(--section-wide) !important;
  margin-top: clamp(40px, 4.5vw, 56px) !important;
  gap: 3px !important;
  background: #0a0a0a;
  padding: 0;
  border: 1px solid rgba(0,0,0,0.1);
  box-shadow: 0 32px 80px -40px rgba(0,0,0,0.3);
}
.pps-before-after--editorial figure { position: relative; text-align: left; box-shadow: none; background: #111; }
.pps-before-after--editorial figcaption.pps-sub {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  margin: 0 !important;
  padding: 12px 16px !important;
  background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, transparent 100%) !important;
  color: #faf6ef !important;
  border: none !important;
  letter-spacing: 0.2em;
}
.pps-compare-dual {
  max-width: var(--section-wide);
  margin: clamp(32px, 3.5vw, 48px) auto 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(12px, 1.2vw, 20px);
  align-items: start;
}
.pps-compare-dual__col { display: flex; flex-direction: column; gap: 0; min-width: 0; align-items: stretch; }
.pps-compare-dual__head {
  font-family: var(--font-ui) !important;
  font-size: var(--type-meta) !important;
  font-weight: 600 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase;
  color: var(--gray-500) !important;
  margin: 0 0 10px !important;
  padding: 0 0 0 2px;
}
.pps-compare-dual__col .pps-figure--editorial { margin-top: 0 !important; align-self: flex-start; width: 100%; }
.pps-compare-dual__col .pps-figure--editorial img {
  width: 100%;
  height: auto !important;
  object-fit: contain;
  object-position: top center;
}
@media (max-width: 1100px) { .pps-content-matrix { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px) {
  .pps-content-matrix { grid-template-columns: 1fr; }
  .pps-figure-pair, .pps-compare-dual { grid-template-columns: 1fr !important; }
  .pps-before-after--editorial { grid-template-columns: 1fr !important; }
}
@media (prefers-reduced-motion: reduce) { .pps-content-matrix__item { transition: none !important; } .pps-content-matrix__item:hover { transform: none; } }
.pps-features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  max-width: 100vw;
  border-top: 1px solid var(--gray-100);
  background: var(--page-white);
}
.pps-feature {
  padding: clamp(48px, 6vw, 80px) clamp(28px, 3.5vw, 52px);
  border-right: 1px solid var(--gray-100);
  background: var(--page-white);
  position: relative;
  transition: background 0.4s ease, box-shadow 0.4s ease;
}
.pps-feature::before { content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 0; background: var(--accent); transition: height 0.5s cubic-bezier(0.22, 1, 0.36, 1); }
.pps-feature:hover::before { height: 100%; }
.pps-feature:hover { background: #fdfbf6; box-shadow: inset 0 0 0 1px rgba(168, 127, 77, 0.12); }
.pps-features .pps-feature:nth-child(1) { animation: ppsFadeIn 0.8s ease 0.04s both; }
.pps-features .pps-feature:nth-child(2) { animation: ppsFadeIn 0.8s ease 0.12s both; }
.pps-features .pps-feature:nth-child(3) { animation: ppsFadeIn 0.8s ease 0.2s both; }
@keyframes ppsFadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
.pps-features .pps-feature:last-child { border-right: none; }
@media (prefers-reduced-motion: reduce) { .pps-features .pps-feature { animation: none !important; } }
.pps-feature__num {
  display: block;
  font-family: var(--font-ui) !important;
  font-size: clamp(2rem, 3.2vw, 2.75rem) !important;
  font-weight: 300 !important;
  letter-spacing: 0.18em !important;
  line-height: 1;
  color: rgba(168, 127, 77, 0.5) !important;
  margin-bottom: clamp(20px, 2.8vw, 28px);
}
.pps-feature__title {
  font-family: var(--font-display) !important;
  font-size: clamp(15px, 1.15vw, 18px) !important;
  font-weight: 400 !important;
  letter-spacing: 0.14em !important;
  text-transform: none;
  color: var(--black) !important;
  margin: 0 0 18px !important;
  line-height: 1.55;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.pps-feature__text {
  font-size: var(--type-body-sm) !important;
  line-height: var(--leading-relaxed) !important;
  letter-spacing: 0.042em !important;
  color: var(--gray-500) !important;
  margin: 0 !important;
}
.pps-section {
  padding: clamp(64px, 8vw, 112px) max(var(--pad), min(5vw, 3rem)) clamp(72px, 9vw, 128px);
  border-top: 1px solid var(--gray-100);
  background: linear-gradient(180deg, #fefdfb 0%, #f9f6f0 50%, #fdfcfa 100%);
}
.pps-section .pps-prose--section { margin-top: 0; }
.pps-figure {
  width: 100%;
  max-width: var(--image-max);
  margin: clamp(28px, 4vw, 40px) auto 0;
  overflow: hidden;
  position: relative;
  background: var(--page-white);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.04), 0 20px 60px -28px rgba(0, 0, 0, 0.12);
}
.pps-section .pps-prose--section + .pps-figure { margin-top: clamp(24px, 3vw, 36px); }
.pps-figure + .pps-figure { margin-top: clamp(20px, 2.5vw, 32px) !important; }
.pps-sub + .pps-figure { margin-top: 14px !important; }
.pps-figure::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.03);
}
.pps-figure img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.85s cubic-bezier(0.22, 1, 0.36, 1), filter 0.5s ease;
}
@media (min-width: 900px) {
  .pps-figure:hover img { transform: scale(1.015); filter: contrast(1.02) brightness(1.01); }
}
@media (prefers-reduced-motion: reduce) { .pps-figure img { transition: none !important; } .pps-figure:hover img { transform: none; filter: none; } }
.pps-section__body {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(28px, 3vw, 40px) clamp(32px, 4vw, 48px);
  margin: clamp(28px, 3vw, 40px) auto 0;
  max-width: var(--image-max);
  font-size: var(--type-body-sm);
  line-height: var(--leading-snug);
  color: var(--gray-500);
  letter-spacing: 0.04em;
}
.pps-section__body p { margin: 0 0 1.15em; }
.pps-section__body p strong {
  display: block;
  margin: 0 0 0.5em 0;
  font-family: var(--font-ui) !important;
  font-size: var(--type-meta);
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--accent) !important;
}
.pps-section__body--single { grid-template-columns: 1fr !important; max-width: var(--text-measure); margin-left: auto; margin-right: auto; }
.pps-prose--after-grid { margin-top: clamp(20px, 2.5vw, 32px) !important; }
.pps-sub {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: clamp(10.5px, 0.88vw, 12px);
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--gray-700) !important;
  margin: clamp(16px, 2.5vw, 20px) 0 4px;
  padding: 8px 16px;
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 2px;
  box-shadow: 0 1px 0 rgba(255,255,255,0.9) inset;
}
.pps-sub--stack { display: table; max-width: var(--image-max); margin-left: auto; margin-right: auto; }
.pps-before-after figcaption {
  display: block;
  font-family: var(--font-ui) !important;
  font-size: clamp(11px, 1.02vw, 13px) !important;
  font-weight: 500 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase;
  color: var(--gray-700) !important;
  margin: 14px 0 0 0;
  padding: 0;
  background: none;
  border: none;
}
.pps-before-after {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(20px, 2.5vw, 32px);
  max-width: var(--image-max);
  margin: clamp(32px, 4vw, 48px) auto 0;
  align-items: start;
}
.pps-before-after figure { margin: 0; text-align: center; background: var(--page-white); box-shadow: 0 0 0 1px rgba(0,0,0,0.04), 0 12px 40px -20px rgba(0,0,0,0.1); align-self: start; }
.pps-before-after img { width: 100%; height: auto !important; display: block; object-fit: contain; object-position: top center; }
.pps-before-after figcaption.pps-sub { margin-top: 12px; border: none; background: transparent; padding: 0; }
.pps-video { position: relative; width: 100%; padding-bottom: 56.25%; height: 0; overflow: hidden; margin-top: 20px; }
.pps-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.pps-section--film {
  background: var(--black);
  color: var(--gray-300);
  border-top: none !important;
  padding: clamp(56px, 9vw, 120px) var(--pad) !important;
  position: relative;
  overflow: hidden;
}
.pps-section--film::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 90% 55% at 50% 0%, rgba(184,149,106,0.14) 0%, transparent 58%);
  pointer-events: none;
}
.pps-film { position: relative; z-index: 1; max-width: min(1100px, var(--image-max)); margin: 0 auto; padding: 0 max(0px, min(1.5vw, 12px)); }
.pps-film__header { text-align: center; margin-bottom: clamp(32px, 5vw, 52px); }
.pps-film__kicker {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: var(--type-meta);
  font-weight: 500;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: rgba(212, 190, 158, 0.95) !important;
  margin: 0 0 20px;
  padding: 10px 22px;
  border: 1px solid rgba(184,149,106,0.35);
  border-radius: 999px;
  background: rgba(184,149,106,0.08);
}
.pps-film__title {
  font-family: var(--font-display) !important;
  font-size: clamp(24px, 2.8vw, 40px) !important;
  font-weight: 300 !important;
  letter-spacing: 0.12em !important;
  line-height: 1.35 !important;
  color: #faf7f0 !important;
  margin: 0 0 22px;
  text-wrap: balance;
}
.pps-film__lead {
  font-size: var(--type-body-sm);
  line-height: var(--leading-relaxed);
  letter-spacing: 0.045em;
  color: #a8a199;
  margin: 0 auto;
  max-width: min(50em, 95vw);
}
.pps-film__stage { position: relative; }
.pps-film__frame {
  position: relative;
  border-radius: 5px;
  padding: 2px;
  background: linear-gradient(155deg, rgba(200,170,120,0.45) 0%, rgba(80,70,60,0.5) 35%, rgba(12,12,12,1) 70%);
  box-shadow: 0 2px 0 rgba(0,0,0,0.4), 0 40px 80px -16px rgba(0,0,0,0.75), 0 0 0 1px rgba(255,255,255,0.05) inset;
}
.pps-film__inner { position: relative; background: #050505; border-radius: 3px; overflow: hidden; }
.pps-film__inner::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.5), inset 0 0 100px rgba(0,0,0,0.15);
  border-radius: 3px;
}
.pps-film__embed { position: relative; z-index: 1; width: 100%; padding-bottom: 56.25%; height: 0; }
.pps-film__embed iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.pps-film__corners { position: absolute; inset: -1px; pointer-events: none; z-index: 3; }
.pps-film__corners i {
  position: absolute;
  width: 20px; height: 20px;
  border-color: rgba(184,149,106,0.5);
  border-style: solid;
  border-width: 0;
}
.pps-film__corners i:nth-child(1) { top: 10px; left: 10px; border-top-width: 1px; border-left-width: 1px; }
.pps-film__corners i:nth-child(2) { top: 10px; right: 10px; border-top-width: 1px; border-right-width: 1px; }
.pps-film__corners i:nth-child(3) { bottom: 10px; left: 10px; border-bottom-width: 1px; border-left-width: 1px; }
.pps-film__corners i:nth-child(4) { bottom: 10px; right: 10px; border-bottom-width: 1px; border-right-width: 1px; }
.pps-film__meta { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px 32px; margin-top: 28px; font-family: var(--font-ui); font-size: 9px; font-weight: 500; letter-spacing: 0.28em; text-transform: uppercase; color: #6e6960; }
.pps-film__caption { text-align: center; margin: 36px auto 0; font-size: var(--type-body-sm); line-height: var(--leading-relaxed); color: #8f897e; max-width: min(54em, 95vw); letter-spacing: 0.042em; }
.pps-cta { text-align: center; padding: clamp(72px, 9vw, 120px) max(var(--pad), 1.5rem) clamp(88px, 11vw, 140px); border-top: 1px solid var(--gray-100); background: linear-gradient(180deg, #fff 0%, #f5f0e6 55%, #efe8dc 100%); }
.pps-cta__tagline {
  font-family: var(--font-ui);
  font-size: var(--type-meta);
  font-weight: 600;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--gray-700) !important;
  margin: 0 0 22px;
}
.pps-cta__lead {
  font-size: var(--type-body);
  line-height: var(--leading-relaxed);
  letter-spacing: 0.04em;
  color: var(--gray-500);
  max-width: min(48em, 92vw);
  margin: 0 auto 32px;
}
.pps-cta a {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: var(--type-meta);
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  border-bottom: none;
  padding: 15px 32px;
  background: var(--black);
  color: #fffcf5 !important;
  border-radius: 3px;
  box-shadow: 0 12px 40px -8px rgba(0,0,0,0.25);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s;
}
.pps-cta a:hover {
  color: var(--white) !important;
  background: var(--accent);
  border-bottom: none;
  transform: translateY(-2px);
  box-shadow: 0 16px 48px -10px rgba(168, 127, 77, 0.5);
  opacity: 1;
}
#related-projects.project-related { border-top: 1px solid var(--gray-100); background: #faf8f2; }
@media (max-width: 900px) {
  .pps-features { grid-template-columns: 1fr; }
  .pps-feature { border-right: none; border-bottom: 1px solid var(--gray-100); }
  .pps-features .pps-feature:last-child { border-bottom: none; }
  .pps-section__body { grid-template-columns: 1fr; }
  .pps-before-after { grid-template-columns: 1fr; }
  .pps-film { max-width: 100%; padding: 0 0.5rem; }
}
@media (max-width: 768px) {
  :root { --pad: 20px; }
  .pps-hero { min-height: 72vh; }
  .pps-hero__title { letter-spacing: 0.12em !important; }
  .pps-hero__scroll { display: none; }
  .pps-concept { padding-left: max(1.25rem, 4vw) !important; padding-right: max(1.25rem, 4vw) !important; }
  .pps-figure { max-width: 100%; margin-top: 1.5rem; }
  .pps-section { padding-left: max(1.25rem, 4vw) !important; padding-right: max(1.25rem, 4vw) !important; }
  .footer-grid { grid-template-columns: 1fr !important; }
  .pps-before-after { grid-template-columns: 1fr; }
}

#site-footer { background: var(--black) !important; color: var(--gray-300); padding: 80px 0 48px !important; display: block !important; width: 100% !important; max-width: 100vw !important; position: relative !important; left: 0 !important; right: 0 !important; transform: none !important; clear: both !important; box-sizing: border-box !important; }
.footer-inner { padding: 0 var(--pad); box-sizing: border-box; }
.footer-logo { font-family: var(--font-display) !important; font-size: 28px; font-weight: 300; color: var(--white) !important; letter-spacing: 0.1em; margin-bottom: 56px; display: block; }
.footer-grid { display: grid !important; grid-template-columns: 2fr 1fr; gap: 60px; margin-bottom: 56px; }
.footer-col-title { font-size: 9px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--accent); margin-bottom: 20px; display: block; }
.footer-col a { display: block; font-size: 12px; color: var(--gray-500) !important; margin-bottom: 12px; }
.footer-col a:hover { color: var(--white) !important; opacity: 1 !important; }
#site-footer .footer-col a:focus,
#site-footer .footer-col a:active {
  outline: none !important;
  outline-offset: 0 !important;
  color: inherit !important;
  text-decoration: none !important;
  -webkit-tap-highlight-color: transparent;
  border: none !important;
  box-shadow: none !important;
}
#site-footer .office-addr a:focus,
#site-footer .office-addr a:active {
  outline: none !important;
  outline-offset: 0 !important;
  color: inherit !important;
  text-decoration: none !important;
  -webkit-tap-highlight-color: transparent;
  border: none !important;
  box-shadow: none !important;
}
.office-name { font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--accent); display: block; margin-bottom: 6px; }
.office-item { margin-bottom: 28px; }
.office-addr,.office-tel { font-size: 12px; color: var(--gray-500); line-height: 1.9; }
.footer-divider { border: none; border-top: 1px solid rgba(255,255,255,0.07); margin-bottom: 32px; }
.footer-copy { font-size: 10px; letter-spacing: 0.18em; color: var(--gray-700); text-align: center; }

