:root { color-scheme: dark; --black: #050403; --gold: #c4a16b; --muted: #918a80; --line: rgba(196, 161, 107, .2); }
* { box-sizing: border-box; }
html { background: var(--black); scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; background: var(--black); color: #e8e1d7; font-family: "Cinzel", serif; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }

.catalog-header {
  position: relative;
  z-index: 10;
  display: grid;
  height: 68px;
  align-items: center;
  grid-template-columns: 1fr auto 1fr;
  padding: 0 clamp(1.25rem, 3vw, 3rem);
  border-bottom: 1px solid var(--line);
  background: rgba(3, 3, 2, .88);
}
.catalog-brand { color: var(--gold); font-size: clamp(.82rem, 1.2vw, 1.15rem); letter-spacing: .3em; text-transform: uppercase; }
.catalog-header nav { display: flex; height: 100%; align-items: center; gap: clamp(2rem, 5vw, 5rem); }
.catalog-header nav a { position: relative; color: #8c857d; font-size: .63rem; letter-spacing: .22em; text-transform: uppercase; }
.catalog-header nav a.is-active { color: var(--gold); }
.catalog-header nav a.is-active::after { position: absolute; right: 0; bottom: -26px; left: 0; height: 1px; background: var(--gold); content: ""; }
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 1.2rem; }
.icon-button, .language { border: 0; background: transparent; cursor: pointer; }
.icon-button { color: var(--gold); font-family: system-ui; font-size: 1.5rem; }
.language { color: #aaa198; font-size: .62rem; letter-spacing: .18em; }
.header-rule { width: 1px; height: 25px; background: var(--line); }

.catalog-hero { position: relative; display: grid; min-height: clamp(300px, 34vw, 520px); overflow: hidden; align-items: center; background: #020202; }
.catalog-hero::after { position: absolute; inset: 0; background: linear-gradient(90deg, #020202 4%, transparent 40%, transparent 70%, #020202 100%); content: ""; pointer-events: none; }
.catalog-hero img { position: absolute; z-index: 0; right: 2%; width: min(68vw, 1100px); height: 100%; object-fit: cover; object-position: center; filter: sepia(.08) contrast(1.05); }
.catalog-hero h1 { z-index: 2; margin: 0 0 0 clamp(2rem, 10vw, 10rem); color: #caaa77; font-family: Georgia, serif; font-size: clamp(1.75rem, 3.1vw, 3.2rem); font-weight: 400; line-height: 1.25; }

.catalog { padding: 2.3rem clamp(1rem, 4vw, 4.5rem) 5rem; }
.catalog-heading { display: flex; align-items: end; justify-content: space-between; }
.section-label { margin: 0 0 1rem; color: #c9b696; font-size: 1.05rem; letter-spacing: .2em; text-transform: uppercase; }
.catalog-grid { display: grid; margin-top: 1rem; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .9rem; }
.dream-card { position: relative; min-height: 200px; overflow: hidden; border: 1px solid rgba(206, 179, 137, .14); border-radius: 5px; background: #0b0907; transition: border-color .4s, transform .5s; }
.dream-card:hover { border-color: rgba(206, 179, 137, .55); transform: translateY(-4px); }
.dream-card img { width: 100%; height: 100%; object-fit: cover; opacity: .52; filter: sepia(.5) saturate(.65); transition: opacity .5s, transform .8s; }
.dream-card:hover img { opacity: .72; transform: scale(1.06); }
.dream-card > span { position: absolute; right: 0; bottom: 0; left: 0; display: flex; padding: 2.8rem .85rem .7rem; flex-direction: column; background: linear-gradient(transparent, rgba(0,0,0,.92)); }
.dream-card strong { color: #d0ad73; font-size: .64rem; font-weight: 400; letter-spacing: .15em; text-transform: uppercase; }
.dream-card small { margin-top: .3rem; color: #aaa39b; font-size: .58rem; letter-spacing: .14em; }

footer { display: flex; padding: 2.2rem 3rem; border-top: 1px solid var(--line); flex-direction: column; gap: .6rem; color: #8d867e; font-size: .6rem; letter-spacing: .08em; }
footer a { color: var(--gold); font-size: .85rem; letter-spacing: .25em; text-transform: uppercase; }

@media (max-width: 900px) {
  .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-hero img { right: -20%; width: 95vw; opacity: .72; }
}
@media (max-width: 600px) {
  .catalog-header { height: 60px; grid-template-columns: 1fr auto; }
  .catalog-header nav { display: none; }
  .catalog-hero { min-height: 380px; align-items: end; padding-bottom: 3rem; }
  .catalog-hero img { right: -48%; width: 145vw; }
  .catalog-hero h1 { margin-left: 1.25rem; font-size: 1.65rem; }
  .catalog { padding-inline: 1rem; }
  .catalog-grid { grid-template-columns: 1fr; }
  .dream-card { min-height: 240px; }
  footer { padding-inline: 1rem; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }