.rl { --rl-teal: #062f2d; --rl-teal-2: #0b3f3c; }

.rl-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--rl-teal); color: #fff; }
.rl-mosaic { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: right center; }
.rl-hero::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, rgba(6,47,45,.9) 0%, rgba(6,47,45,.86) 40%, rgba(6,47,45,.6) 58%, rgba(6,47,45,.18) 80%, rgba(6,47,45,.05) 100%); }
.rl-hero-in { padding-top: 72px; padding-bottom: 96px; }
.rl-hero-in > * { max-width: 600px; }

.rl-wall { position: absolute; z-index: -2; top: 0; bottom: 0; right: max(calc((100% - var(--content-col-max, 1236px)) / 2 - 40px), -24px); display: flex; gap: 14px; align-items: flex-start; }
.rl-col { display: flex; flex-direction: column; gap: 14px; }
.rl-col.a { width: 150px; margin-top: -70px; }
.rl-col.b { width: 220px; margin-top: -130px; }
.rl-col.c { width: 300px; margin-top: -36px; }
.rl-tile { display: block; aspect-ratio: 1; overflow: hidden; border-radius: 12px; background: var(--rl-teal-2); }
.rl-tile img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rl-hero.has-wall::before { background: linear-gradient(90deg, var(--rl-teal) 0%, var(--rl-teal) 38%, rgba(6,47,45,.72) 52%, rgba(6,47,45,.3) 66%, rgba(6,47,45,0) 80%); }
.rl-credit { position: absolute; right: 16px; bottom: 10px; margin: 0; font-size: 11.5px; line-height: 1.3; color: rgba(255,255,255,.78); text-shadow: 0 1px 2px rgba(0,0,0,.7); }
.rl .rl-crumb a + span + a { color: rgba(255,255,255,.72); font-weight: 500; }
.rl-crumb { display: flex; gap: 8px; align-items: center; font-size: 14px; color: rgba(255,255,255,.72); }
.rl .rl-crumb a { color: rgba(255,255,255,.86); font-weight: 600; }
.rl .rl-hero h1 { margin-top: 28px; color: #fff; font-size: clamp(38px, calc(5vw / var(--bs-zoom, 1)), 64px); font-weight: 800; line-height: 1.02; letter-spacing: -.035em; text-wrap: balance; }
.rl-lede { margin-top: 20px !important; font-size: 18px; line-height: 1.6; color: rgba(255,255,255,.86); }
.rl-count { margin-top: 18px !important; font-size: 16px; color: rgba(255,255,255,.8); }
.rl-count b { font-size: 22px; font-weight: 800; color: #fff; letter-spacing: -.01em; }

.rl-where { position: relative; margin-top: 32px; }
.rl-l { display: block; margin-bottom: 8px; font-size: 15px; font-weight: 700; color: #fff; }
.rl-row { display: flex; gap: 8px; }
.rl-field { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 10px; height: 52px; padding: 0 14px; background: #fff;
  border: 1px solid transparent; border-radius: var(--radius); box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.rl-field:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(13,148,136,.35); }
.rl-field svg { width: 18px; height: 18px; fill: none; stroke: #0f2340; stroke-width: 1.8; }
.rl-field input { flex: 1; min-width: 0; height: 100%; border: 0; outline: none; background: transparent; font: inherit; font-size: 16px; color: var(--text); }
.rl-row button { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 52px; padding: 0 22px; border: 0; border-radius: var(--radius);
  background: var(--brand); color: #fff; font: inherit; font-size: 16px; font-weight: 700; cursor: pointer; }
.rl-row button:hover { background: var(--brand-dark); }
.rl-row button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.rl-sug { position: absolute; z-index: 5; left: 0; right: 0; top: calc(100% - 34px); margin: 0; padding: 6px; list-style: none; background: #fff; color: var(--text);
  border: 1px solid var(--border); border-radius: var(--radius); box-shadow: 0 12px 32px rgba(0,0,0,.22); max-width: 520px; }
.rl-sug li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 6px; cursor: pointer; font-size: 15px; }
.rl-sug li i { font-style: normal; color: var(--text-secondary); font-size: 13px; white-space: nowrap; }
.rl-sug li[aria-selected="true"], .rl-sug li:hover { background: var(--fl-silver); }
.rl .rl-all { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; color: #fff; font-size: 15px; font-weight: 600; }
.rl .rl-all svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }

.rl-two { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 64px; row-gap: 24px; align-items: start; }
.rl-two-flip { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.rl-two-a { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.rl-side { max-width: calc(36ch * var(--bs-ch, 1)); font-size: 17px; line-height: 1.6; color: var(--text-secondary); }
.rl-two-a .fl-btn { margin-top: 8px; }

.rl-rules { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--border-hover); }
.rl-rules li { padding: 15px 0; border-bottom: 1px solid var(--border); font-size: 18px; font-weight: 600; line-height: 1.4; letter-spacing: -.005em; color: var(--text); text-wrap: pretty; }
.rl-order { margin-top: 16px !important; font-size: 16px; line-height: 1.6; color: var(--text-secondary); }
.rl-order b { color: var(--text); font-weight: 700; }

.rl-site { padding-bottom: clamp(56px, calc(7vw / var(--bs-zoom, 1)), 96px); margin-top: clamp(56px, calc(7vw / var(--bs-zoom, 1)), 96px); background: var(--fl-silver); }
.rl .rl-rec { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); overflow: hidden; background: var(--card-bg); border: 1px solid var(--fl-line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); color: var(--text); font-weight: 400; }
.rl a.rl-rec:hover { border-color: var(--fl-navy); text-decoration: none; }
.rl-rec-img { display: block; min-height: 100%; background: var(--rl-teal-2); }
.rl-rec-img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rl-rec-body { display: flex; flex-direction: column; min-width: 0; padding: 22px 24px 20px; }
.rl-rec-top b { display: block; font-size: 19px; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; }
.rl-rec-top i { display: block; margin-top: 2px; font-style: normal; font-size: 14.5px; color: var(--text-secondary); }
.rl-kv { display: block; margin-top: 14px; border-top: 1px solid var(--border); }
.rl-kv > span { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 14.5px; line-height: 1.35; }
.rl-kv i { font-style: normal; color: var(--text-secondary); }
.rl-kv b { font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.rl-rec-go { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 16px; font-size: 15px; font-weight: 600; color: var(--fl-navy); }
.rl-rec-go svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.rl .rl-rec-plain { grid-template-columns: 1fr; }
.rl-points { margin: 8px 0 0; display: grid; gap: 22px; }
.rl-points dt { font-size: 17px; font-weight: 700; line-height: 1.35; color: var(--text); }
.rl-points dd { margin: 4px 0 0; font-size: 16px; line-height: 1.6; color: var(--text-secondary); max-width: calc(44ch * var(--bs-ch, 1)); }

.rl-policy-t p + p { margin-top: 16px !important; }
.rl-policy-t p { font-size: 17px; line-height: 1.65; color: var(--text-secondary); max-width: calc(68ch * var(--bs-ch, 1)); }

.rl-exs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 16px; margin: 32px 0 0; padding: 0; list-style: none; }
.rl .rl-ex { display: flex; flex-direction: column; gap: 3px; height: 100%; color: var(--text); font-weight: 400; }
.rl .rl-ex:hover { text-decoration: none; }
.rl-ex-img { display: block; aspect-ratio: 3 / 2; margin-bottom: 10px; overflow: hidden; border-radius: 12px; background: var(--rl-teal-2); }
.rl-ex-img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s var(--ease, ease); }
.rl .rl-ex:hover .rl-ex-img img { transform: scale(1.03); }
.rl-ex-top { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.rl-ex-top b { font-size: 17px; font-weight: 700; line-height: 1.3; }
.rl-ex-top em { font-style: normal; font-weight: 600; color: var(--text); white-space: nowrap; font-variant-numeric: tabular-nums; }
.rl-ex-c { font-size: 14.5px; color: var(--text-secondary); }
.rl-ex-f { font-size: 14.5px; color: var(--text); }
.rl-ex-f i { font-style: normal; color: var(--text-secondary); }
.rl-credit-b { position: static; margin-top: 18px !important; color: var(--text-muted); text-shadow: none; }

.rl-rel { padding-bottom: clamp(56px, calc(7vw / var(--bs-zoom, 1)), 96px); }
.rl-rels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; margin: 24px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--border-hover); }
.rl .rl-rels a { display: grid; grid-template-columns: 1fr auto; column-gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--border); color: var(--text); font-weight: 400; }
.rl .rl-rels a:hover { text-decoration: none; }
.rl .rl-rels a:hover b { text-decoration: underline; }
.rl-rels b { font-size: 17px; font-weight: 700; line-height: 1.35; }
.rl-rels i { grid-column: 1; margin-top: 2px; font-style: normal; font-size: 14.5px; line-height: 1.5; color: var(--text-secondary); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rl-rels svg { grid-row: 1 / span 2; grid-column: 2; align-self: center; width: 16px; height: 16px; fill: none; stroke: var(--fl-navy); stroke-width: 1.8; }

@container (max-width: 1180px) {
  .rl-col.a { display: none; }
  .rl-hero.has-wall::before { background: linear-gradient(90deg, var(--rl-teal) 0%, var(--rl-teal) 46%, rgba(6,47,45,.6) 62%, rgba(6,47,45,0) 84%); }
  .rl-hero-in > * { max-width: 520px; }
}
@container (max-width: 980px) {
  .rl-col.b { display: none; }
  .rl-wall { right: -110px; }
  .rl-hero-in > * { max-width: 470px; }
  .rl-hero::before { background: linear-gradient(90deg, var(--rl-teal) 0%, rgba(6,47,45,.9) 60%, rgba(6,47,45,.55) 100%); }
  .rl-hero.has-wall::before { background: linear-gradient(90deg, var(--rl-teal) 0%, var(--rl-teal) 56%, rgba(6,47,45,.5) 76%, rgba(6,47,45,0) 100%); }
  .rl-two, .rl-two-flip { grid-template-columns: 1fr; }
  .rl-two-flip .rl-two-a { order: -1; }
  .rl-side { max-width: calc(60ch * var(--bs-ch, 1)); }
  .rl-exs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rl-rels { grid-template-columns: 1fr; }
}
@container (max-width: 700px) {
  
  .rl-hero { display: flex; flex-direction: column; }
  .rl-hero-in { padding-top: 40px; padding-bottom: 28px; }
  .rl-hero-in > * { max-width: none; }
  .rl-hero.has-wall::before { content: none; }
  .rl-wall { position: static; order: 2; gap: 10px; padding: 0 var(--content-col-pad, 16px) 44px; overflow: hidden; }
  .rl-col.c { display: flex; flex-direction: row; gap: 10px; width: auto; margin: 0; flex: 1 0 auto; }
  .rl-col.c .rl-tile { flex: 0 0 calc((100vw / var(--bs-zoom, 1) - 2 * var(--content-col-pad, 16px) - 20px) / 2.4); }
  .rl-credit { right: auto; left: var(--content-col-pad, 16px); bottom: 14px; font-size: 11px; }
  .rl-hero-in { padding-top: 132px; }
  .rl-hero.has-wall .rl-hero-in { padding-top: 40px; }
  .rl-hero:not(.has-wall)::before { background: linear-gradient(180deg, rgba(6,47,45,.25) 0%, rgba(6,47,45,.55) 90px, rgba(6,47,45,.92) 200px, var(--rl-teal) 300px); }
  .rl-mosaic { height: 420px; object-position: center top; }
  .rl-hero:not(.has-wall) .rl-crumb { text-shadow: 0 1px 2px rgba(0,0,0,.6); }
  .rl-row { flex-direction: column; }
  .rl-row button { justify-content: center; }
  .rl-sug { top: 84px; }
  .rl-rules li { font-size: 17px; padding: 13px 0; }
  .rl .rl-rec { grid-template-columns: 1fr; }
  .rl-rec-img { aspect-ratio: 16 / 10; min-height: 0; }
  .rl-rec-body { padding: 18px 18px 18px; }
  .rl-exs { gap: 18px 12px; }
  .rl-ex-top { flex-direction: column; gap: 0; }
  .rl-ex-top b { font-size: 16px; }
  .rl-ex-f { display: none; }
}