:root {
  --fp-gold: #e7ce86;
  --fp-ink: #090a0c;
  --fp-line: rgba(255,255,255,.16);
  --fp-muted: #d3d3d3;
}
body.facade-page { background: #08090b; color: #fff; }
.facade-page main { background: repeating-linear-gradient(90deg,transparent 0 39px,rgba(255,255,255,.025) 39px 40px); padding: 28px 0 54px; }
.facade-page figure { margin: 0; }
.fp-wrap { width: min(1160px, calc(100% - 48px)); margin: 0 auto; }
.fp-wrap--wide { width: min(1460px, calc(100% - 48px)); }
.fp-section { margin: 48px 0; scroll-margin-top: calc(var(--headerH, 110px) + 20px); }
.fp-hero-section { margin-top: 8px; }
.fp-card { padding: clamp(22px,3vw,38px); border: 1px solid var(--fp-line); border-radius: 22px; background: linear-gradient(140deg,#1b1c1e,#101113); }
.fp-h1 { color: var(--fp-gold); font-size: clamp(30px,3.4vw,50px); line-height: 1.13; font-weight: 650; margin: 22px 0; letter-spacing: -.025em; }
.fp-h2 { color: var(--fp-gold); font-size: clamp(24px,2.3vw,33px); line-height: 1.22; margin: 0 0 20px; font-weight: 600; }
.facade-page .fp-h3 { color: #f5f1e6; font-size: 21px; line-height: 1.3; margin: 0 0 12px; }
.fp-p,.fp-list { font-size: 17px; line-height: 1.8; color: var(--fp-muted); }
.fp-p { margin: 0; }
.fp-note { margin-top: 20px; font-size: 15px; }
.fp-list { padding-left: 23px; margin: 0; }
.fp-list li + li { margin-top: 12px; }
.fp-list strong { color: #fff; }
.fp-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.fp-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 13px 19px; border: 1px solid #6c6c69; border-radius: 14px; text-decoration: none; color: #fff; background: #191a1b; font-weight: 600; font-size: 16px; text-align: center; line-height: 1.4; }
.fp-btn--gold { background: #353025; border-color: #c2a963; }
.fp-btn:hover { border-color: var(--fp-gold); background: #3c3526; }
.fp-text-link { color: var(--fp-gold); text-underline-offset: 4px; }
.facade-page main a:focus-visible,.fp-roller-btn:focus-visible,.fp-faq summary:focus-visible,.fp-roller:focus-visible { outline: 2px solid var(--fp-gold); outline-offset: 5px; }
.fp-badge { display: inline-block; max-width: 100%; font-size: 11px; letter-spacing: .08em; line-height: 1.5; padding: 7px 11px; border: 1px solid #6b6656; border-radius: 40px; color: #f6e7bc; background: #171717; }
.fp-hero-layout { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(26px,4vw,62px); align-items: center; }
.fp-hero-text { color: var(--fp-muted); font-size: 18px; line-height: 1.8; margin: 0; }
.fp-hero-pictures { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; align-items: start; }
.fp-hero-pictures > .fp-media:first-child { grid-column: 1 / -1; }
.fp-media { position: relative; border: 1px solid var(--fp-line); border-radius: 18px; overflow: hidden; background: #161718; min-width: 0; }
.fp-media img { display: block; width: 100%; height: auto; }
.fp-compare-cap,.fp-mini-cap { display: flex; align-items: center; gap: 10px; padding: 13px 16px; font-size: 14px; line-height: 1.5; color: #eee; background: #191a1c; }
.fp-section-nav { display: flex; gap: 10px 28px; flex-wrap: wrap; margin-top: 32px; padding: 20px 0; border-block: 1px solid var(--fp-line); }
.fp-section-nav a { color: var(--fp-gold); font-size: 15px; text-decoration: none; padding: 5px 0; }
.fp-section-nav a:hover { text-decoration: underline; text-underline-offset: 5px; }
.fp-scope-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.fp-scope-grid .fp-card { padding: 26px; }
.fp-scope-result { margin-top: 20px; }
.fp-ba-media { display: grid; grid-template-columns: 1fr 2fr; align-items: center; gap: 22px; border: 0; background: none; }
.fp-ba-media > img { grid-column: 2; grid-row: 1 / 3; border-radius: 16px; }
.fp-ba-before { grid-row: 1; grid-column: 1; }
.fp-ba-overlay { grid-column: 1; grid-row: 2; }
.fp-ba-text { font-size: 15px; }
.fp-head { display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.fp-roller-actions { display: flex; gap: 8px; }
.fp-roller-btn { width: 44px; height: 44px; background: #242425; color: #fff; border: 1px solid #777; border-radius: 12px; font-size: 27px; cursor: pointer; }
.fp-roller { display: flex; gap: 16px; overflow-x: auto; padding: 5px 0 16px; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: #a99765 #262626; }
.fp-roller-item { flex: 0 0 360px; height: 200px; scroll-snap-align: start; background: #eee; }
.fp-roller-item img { width: 100%; height: 100%; object-fit: cover; filter: blur(2px); transform: scale(1.04); }
.fp-cases { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 24px; }
.fp-case { display: grid; grid-template-columns: 1fr 1.8fr; align-items: start; gap: 10px; padding: 16px; background: #101112; border: 1px solid var(--fp-line); border-radius: 18px; }
.fp-case .fp-compare-cap { flex-wrap: wrap; font-size: 13px; padding: 10px; }
.fp-case .fp-mini-cap { padding: 8px; }
.fp-case .fp-badge { font-size: 10px; }
.fp-case-hero img,.fp-case-mini img { aspect-ratio: 4/3; object-fit: contain; }
.fp-steps { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 28px; }
.fp-step { display: grid; grid-template-columns: 44px 1fr; gap: 16px; }
.fp-step-no { display: flex; align-items: center; justify-content: center; height: 44px; border-radius: 12px; background: var(--fp-gold); color: #19150c; font-size: 20px; font-weight: 700; }
.fp-grid-2 { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 32px; }
.fp-grid-2 .fp-h2 { margin-top: 18px; }
.fp-faq { border-top: 1px solid var(--fp-line); }
.fp-faq details { border-bottom: 1px solid var(--fp-line); padding: 0 4px; }
.fp-faq summary { padding: 24px 30px 24px 0; font-size: 20px; font-weight: 600; cursor: pointer; }
.fp-faq details[open] summary { color: var(--fp-gold); }
.fp-faq details .fp-p { padding: 0 0 24px; max-width: 90ch; }
.fp-contact { background: linear-gradient(130deg,#302d23,#141517); border-color: #7d7150; }
.fp-contact .fp-h2 { margin-top: 20px; }
@media(max-width:1100px) {
  .fp-hero-layout { grid-template-columns: 1fr 1fr; gap: 28px; }
  .fp-cases { grid-template-columns: 1fr; }
  .fp-scope-grid { grid-template-columns: 1fr; }
}
@media(max-width:760px) {
  .fp-wrap,.fp-wrap--wide { width: calc(100% - 32px); }
  .fp-section { margin: 34px 0; }
  .fp-hero-section { margin-top: 0; }
  .fp-hero-layout,.fp-grid-2,.fp-steps { grid-template-columns: 1fr; }
  .fp-h1 { font-size: clamp(30px,7vw,42px); }
  .fp-hero-pictures { grid-template-columns: 1fr 1fr; }
  .fp-hero-before .fp-mini-cap { flex-wrap: wrap; }
  .fp-actions { align-items: stretch; flex-direction: column; }
  .fp-btn { width: 100%; }
  .fp-ba-media { grid-template-columns: 1fr; }
  .fp-ba-media > img { grid-column: 1; grid-row: 1; }
  .fp-ba-before { grid-column: 1; grid-row: 2; width: 65%; }
  .fp-ba-overlay { grid-column: 1; grid-row: 3; }
  .fp-head { flex-wrap: wrap; }
  .fp-head .fp-h2 { margin-bottom: 0; }
  .fp-roller { margin-top: 16px; }
  .fp-roller-item { flex-basis: 260px; height: 150px; }
  .fp-case { grid-template-columns: 1fr; }
  .fp-case-before { width: 65%; }
  .fp-section-nav { gap: 6px 20px; }
  .fp-p,.fp-list { font-size: 16px; }
  .fp-hero-text { font-size: 17px; }
}