:root {
  --sr-ink: #18271e;
  --sr-forest: #102219;
  --sr-forest-soft: #1c3326;
  --sr-gold: #b79042;
  --sr-gold-light: #d9bd78;
  --sr-paper: #f3efe5;
  --sr-paper-deep: #e9e1d2;
  --sr-muted: #647067;
  --sr-line: rgba(24, 39, 30, 0.16);
}

.sr-page { background: var(--sr-paper); color: var(--sr-ink); overflow: hidden; }
.sr-page em { color: var(--sr-gold); font-style: italic; }
.sr-page a { text-decoration: none; }

.sr-hero {
  min-height: clamp(620px, 76vh, 820px);
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: stretch;
  color: #fff;
  background: var(--sr-forest);
}
.sr-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image: var(--sr-hero-image);
  background-position: center 44%;
  background-size: cover;
  filter: saturate(.72) contrast(1.04);
  transform: scale(1.015);
}
.sr-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(8, 19, 13, .94) 0%, rgba(8, 19, 13, .76) 46%, rgba(8, 19, 13, .34) 75%, rgba(8, 19, 13, .5) 100%),
    linear-gradient(0deg, rgba(8, 19, 13, .92) 0%, transparent 48%);
}
.sr-hero-inner {
  width: 100%;
  padding-top: clamp(132px, 17vh, 178px);
  padding-bottom: clamp(64px, 9vh, 96px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(440px, .82fr);
  grid-template-rows: auto 1fr;
  column-gap: clamp(48px, 8vw, 120px);
  align-items: end;
}
.sr-breadcrumb {
  grid-column: 1 / -1;
  align-self: start;
  display: flex;
  align-items: center;
  gap: .7rem;
  margin-bottom: clamp(52px, 9vh, 100px);
  color: rgba(255,255,255,.7);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.sr-breadcrumb a { color: #fff; }
.sr-breadcrumb i { color: var(--sr-gold-light); font-size: .65rem; }
.sr-kicker {
  margin: 0 0 1rem;
  color: var(--sr-gold);
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.sr-hero-copy { max-width: 700px; }
.sr-hero-copy h1,
.sr-results-head h2,
.sr-starter h2,
.sr-empty h2,
.sr-empty h3,
.sr-closing h2 {
  margin: 0;
  font-family: "Playfair Display", Georgia, serif;
  letter-spacing: -.04em;
}
.sr-hero-copy h1 { max-width: 660px; font-size: clamp(3.4rem, 6.5vw, 6.7rem); line-height: .93; }
.sr-hero-copy > p:last-child { max-width: 590px; margin: 1.45rem 0 0; color: rgba(255,255,255,.78); font-size: clamp(1rem, 1.4vw, 1.18rem); line-height: 1.8; }

.sr-search {
  align-self: end;
  padding: clamp(1.5rem, 2.5vw, 2.25rem) 0;
  border-top: 1px solid rgba(255,255,255,.28);
  border-bottom: 1px solid rgba(255,255,255,.28);
}
.sr-search label { display: block; margin-bottom: .85rem; color: #fff; font-family: "Playfair Display", Georgia, serif; font-size: 1.45rem; }
.sr-search-control { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .85rem; background: #fff; padding: .48rem .5rem .48rem 1.1rem; }
.sr-search-control > i { color: var(--sr-gold); font-size: 1.1rem; }
.sr-search-control input { min-width: 0; border: 0; outline: 0; padding: .72rem 0; color: var(--sr-ink); font: inherit; background: transparent; }
.sr-search-control input::placeholder { color: #7a827d; }
.sr-search-control button,
.sr-button {
  border: 1px solid var(--sr-gold);
  background: var(--sr-gold);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .7rem;
  padding: .95rem 1.25rem;
  font-size: .75rem;
  font-weight: 850;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.sr-search-control button:hover,
.sr-search-control button:focus-visible,
.sr-button:hover,
.sr-button:focus-visible { background: transparent; color: var(--sr-gold-light); transform: translateY(-2px); }
.sr-search > p { margin: .85rem 0 0; color: rgba(255,255,255,.65); font-size: .82rem; line-height: 1.6; }

.sr-results { padding: clamp(76px, 9vw, 132px) 0; background: radial-gradient(circle at 88% 6%, rgba(183,144,66,.1), transparent 32rem), var(--sr-paper); }
.sr-results-head { display: flex; align-items: end; justify-content: space-between; gap: 2rem; padding-bottom: 2rem; border-bottom: 1px solid var(--sr-line); }
.sr-results-head h2,
.sr-starter h2,
.sr-empty h2 { font-size: clamp(2.15rem, 4vw, 4rem); line-height: 1.03; }
.sr-breakdown { max-width: 520px; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: .55rem; }
.sr-breakdown span { border-bottom: 1px solid rgba(183,144,66,.5); padding: .45rem .2rem; color: var(--sr-muted); font-size: .78rem; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; }
.sr-breakdown b { color: var(--sr-gold); margin-left: .28rem; }

.sr-grid { margin-top: clamp(2.5rem, 5vw, 4.5rem); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(2.1rem, 4vw, 4.1rem) clamp(1.6rem, 3vw, 2.8rem); }
.sr-card { min-width: 0; display: flex; flex-direction: column; border-bottom: 1px solid var(--sr-line); }
.sr-card-media { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 2.6rem 0 2.6rem 0; background: var(--sr-paper-deep); }
.sr-card-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(9,23,15,.45), transparent 52%); pointer-events: none; }
.sr-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease, filter .45s ease; }
.sr-card:hover .sr-card-media img { transform: scale(1.025); filter: saturate(1.04); }
.sr-card-media span { position: absolute; z-index: 1; left: 1.1rem; bottom: 1rem; color: #fff; font-size: .68rem; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.sr-card-copy { display: flex; flex-direction: column; flex: 1; padding: 1.4rem .15rem 1.7rem; }
.sr-card-meta { margin: 0 0 .75rem !important; color: var(--sr-gold) !important; font-size: .7rem !important; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.sr-card h3 { margin: 0; font-family: "Playfair Display", Georgia, serif; font-size: clamp(1.48rem, 2vw, 2rem); line-height: 1.08; letter-spacing: -.025em; }
.sr-card h3 a { color: var(--sr-ink); }
.sr-card-copy > p:not(.sr-card-meta) { margin: 1rem 0 1.3rem; color: var(--sr-muted); line-height: 1.72; }
.sr-card-link { width: fit-content; margin-top: auto; color: var(--sr-gold); font-size: .72rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.sr-card-link i { margin-left: .35rem; transition: transform .2s ease; }
.sr-card-link:hover i { transform: translateX(4px); }

.sr-pagination { margin-top: 3rem; padding-top: 1.4rem; border-top: 1px solid var(--sr-line); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; }
.sr-pagination > span { color: var(--sr-muted); font-size: .8rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.sr-pagination > a { color: var(--sr-ink); font-size: .75rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.sr-pagination > a:last-child { justify-self: end; }

.sr-empty { margin-top: 3rem; padding: clamp(2rem, 5vw, 4.5rem) 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: clamp(1.5rem, 4vw, 4rem); border-top: 1px solid var(--sr-line); border-bottom: 1px solid var(--sr-line); }
.sr-empty-mark { width: 72px; height: 72px; display: grid; place-items: center; border: 1px solid rgba(183,144,66,.55); border-radius: 50%; color: var(--sr-gold); font-size: 1.55rem; }
.sr-empty h3 { font-size: clamp(1.8rem, 3vw, 3.1rem); }
.sr-empty p:last-child { max-width: 720px; margin: .85rem 0 0; color: var(--sr-muted); line-height: 1.75; }
.sr-empty-compact { grid-template-columns: auto 1fr; }

.sr-starter { display: grid; grid-template-columns: minmax(0, .85fr) minmax(480px, 1fr); gap: clamp(3rem, 8vw, 8rem); align-items: start; }
.sr-starter > div > p:last-child { max-width: 520px; margin: 1.25rem 0 0; color: var(--sr-muted); line-height: 1.75; }
.sr-starter-links { border-top: 1px solid var(--sr-line); }
.sr-starter-links a { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem; padding: 1.2rem .25rem; color: var(--sr-ink); border-bottom: 1px solid var(--sr-line); transition: color .2s ease, padding .2s ease; }
.sr-starter-links a:hover { color: var(--sr-gold); padding-left: .65rem; }
.sr-starter-links > a > i:first-child { width: 34px; color: var(--sr-gold); font-size: 1.15rem; }
.sr-starter-links span { display: flex; flex-direction: column; gap: .2rem; color: var(--sr-muted); font-size: .83rem; }
.sr-starter-links b { color: var(--sr-ink); font-family: "Playfair Display", Georgia, serif; font-size: 1.2rem; }

.sr-closing { padding: clamp(70px, 9vw, 120px) 0; color: #fff; background: radial-gradient(circle at 75% 35%, rgba(183,144,66,.14), transparent 28rem), var(--sr-forest); }
.sr-closing-inner { display: flex; align-items: end; justify-content: space-between; gap: 3rem; }
.sr-closing h2 { max-width: 850px; font-size: clamp(2.25rem, 4.5vw, 4.75rem); line-height: 1; }
.sr-closing .sr-button { flex: 0 0 auto; }

@media (max-width: 991.98px) {
  .sr-hero-inner { grid-template-columns: 1fr; align-items: end; }
  .sr-breadcrumb { margin-bottom: 3.5rem; }
  .sr-search { margin-top: 3rem; }
  .sr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sr-starter { grid-template-columns: 1fr; }
  .sr-closing-inner { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 767.98px) {
  .sr-hero { min-height: 680px; }
  .sr-hero-inner { padding-top: 112px; }
  .sr-hero-copy h1 { font-size: clamp(3rem, 15vw, 4.6rem); }
  .sr-search-control { grid-template-columns: auto minmax(0, 1fr); }
  .sr-search-control button { grid-column: 1 / -1; }
  .sr-results-head { align-items: flex-start; flex-direction: column; }
  .sr-breakdown { justify-content: flex-start; }
  .sr-grid { grid-template-columns: 1fr; }
  .sr-empty { grid-template-columns: 1fr; }
  .sr-empty-mark { width: 60px; height: 60px; }
  .sr-pagination { grid-template-columns: 1fr auto 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .sr-page *, .sr-page *::before, .sr-page *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}