/* Rules page (round 3, 2026-11-07). Loaded only by /rules/. */
.rl-jump { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px !important; }
.hero-intro .rl-jump a { padding: 9px 16px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .45); color: #fff; font-size: 16px; font-weight: 700; text-decoration: none; }
.hero-intro .rl-jump a:hover { background: rgba(255, 255, 255, .14); border-color: #fff; }

.rl-sec, .rl-sec .rule, #paid-search { scroll-margin-top: 130px; }
.rl-sec > p { margin: 0 0 12px; }

.rl-short.lift { margin-top: -36px; }
.rl-short h2 { font-size: 26px; font-weight: 900; margin: 0 0 12px; }
.rl-short ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.rl-short li { display: flex; gap: 12px; align-items: flex-start; }
.rl-short li .ico { flex: none; width: 26px; height: 26px; padding: 5px; border-radius: 50%; margin-top: 1px; }
.rl-short li.y .ico { background: #e6f3e8; color: var(--green); }
.rl-short li.n .ico { background: #fdeceb; color: var(--red); }
.rl-ask { margin: 16px 0 0; padding-top: 14px; border-top: 1px dashed var(--line); }
.rl-ask a, .rl-add a, .rl-cb a { color: var(--orange-d); overflow-wrap: anywhere; }
.rl-add { margin-top: 8px !important; color: var(--muted); }
.rl-cb { font-size: var(--fs-body); }

.rl-col { margin-bottom: 14px; }
.rl-col h3, .rl-paid h3 { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; font-size: 22px; }
.rl-col .mark, .rl-paid .mark { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 50%; }
.rl-col .mark .ico, .rl-paid .mark .ico { width: 20px; height: 20px; }
.mark.do { background: #e6f3e8; color: var(--green); }
.mark.dont { background: #fdeceb; color: var(--red); }
.mark.info { background: var(--tint); color: var(--orange-d); }
.rl-col ul { margin: 0; padding-left: 22px; }
.rl-col li { margin: 6px 0; }
.rl-col dl { margin: 0; display: grid; gap: 12px; }
.rl-col dt { font-weight: 700; color: var(--ink); }
.rl-col dd { margin: 2px 0 0; }
.rl-ok { border-top: 4px solid var(--green); }
.rl-care { border-top: 4px solid var(--orange); }
.rl-never { border-top: 4px solid var(--red); }

.rl-swap-h { font-size: 22px; margin: 30px 0 12px; }
.rl-swaps { display: grid; gap: 12px; }
.rl-swap { display: grid; grid-template-columns: 1fr 1fr; background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.rl-swap p { display: flex; gap: 10px; align-items: flex-start; margin: 0; padding: 14px 18px; }
.rl-swap .ico { flex: none; width: 20px; height: 20px; margin-top: 4px; }
.rl-bad { background: #fdf3f2; color: #7a1f16; }
.rl-bad span { text-decoration: line-through; text-decoration-color: rgba(122, 31, 22, .45); }
.rl-bad .ico { color: var(--red); }
.rl-good .ico { color: var(--green); }
.rl-vary { margin-top: 18px; }
.rl-vary p { margin: 0; }

.rl-discs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.rl-disc { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px; }
.rl-where { margin: 0; font-size: 16px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--orange-d); }
.rl-line { margin: 0; flex: 1; font-style: italic; color: var(--ink); }
.rl-disc .btn-mini { align-self: flex-start; }

.rl-paid { margin: 18px 0 14px; border: 2px solid #f2c1bc; background: #fffafa; }
.rl-paid p { margin: 0 0 10px; }
.rl-paid p:last-child { margin: 0; }
.rl-terms { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; padding: 0; }
.rl-terms li { padding: 6px 14px; border-radius: 999px; background: #fff; border: 1px solid #f2c1bc; font-weight: 700; color: var(--ink); }

.rl-contact { display: flex; gap: 22px; align-items: center; background: linear-gradient(135deg, #fff, #fff0f4); }
.rl-contact img { width: 96px; height: 96px; flex: none; border-radius: 50%; object-fit: cover; border: 3px solid var(--cream); }
.rl-contact h2 { font-size: 26px; font-weight: 900; margin: 0 0 6px; }
.rl-contact p { margin: 0 0 12px; }
.rl-contact p:last-child { margin: 0; }
.rl-contact .btn .ico { width: 18px; height: 18px; }

@media (max-width: 760px) {
  .rl-swap { grid-template-columns: 1fr; }
  .rl-discs { grid-template-columns: 1fr; }
  .rl-contact { flex-direction: column; align-items: flex-start; }
  .rl-col h3, .rl-paid h3 { font-size: 20px; align-items: flex-start; }
  .rl-short.lift { margin-top: -24px; }
}