/* /terms-of-service and /privacy-policy (C2, restructured by P): mist. The water line draws in from the seam at the top
   and its float rides with the reading; the H1 row pairs the title with the entity, the effective date and the contact
   line; the sticky contents index fills the left shore; the whole text is one continuous .prose flow on the right
   shore (one column to 1919px, balanced columns filling the shore at 1920 and above). The hover is the underline
   flattening only. */
.legal { padding-top: clamp(20px, 2vw, 36px); }

/* the scroll scene: the water line, drawn from the seam outward, with the reading float */
.legal__water { position: relative; height: 28px; margin: 0 calc(-1 * var(--gutter)) clamp(22px, 2.6vw, 44px); }
.legal__water-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.legal__wave { fill: none; stroke: var(--raven); stroke-width: 1; opacity: .55; vector-effect: non-scaling-stroke; }
.legal__wave--echo { opacity: .16; }
.legal__water-mark { position: absolute; top: 14px; left: var(--read, 50%); width: 0; height: 0; transition: left .2s linear; }
.legal__water-mark i { position: absolute; left: -4px; top: -11px; width: 8px; height: 8px; border-radius: 50%; background: var(--iris); box-shadow: 0 0 0 0 rgba(181, 107, 255, .3); transform: scale(0); transition: transform var(--dur-base) var(--ease-slack) .5s; }
.legal__water-mark::after { content: ''; position: absolute; left: -.5px; top: -3px; width: 1px; height: 6px; background: var(--iris); transform: scaleY(0); transition: transform var(--dur-fast) var(--ease-slack) .7s; }
.legal__water.is-drawn .legal__water-mark i { transform: scale(1); animation: rc-spine-pulse 6s var(--ease-swell) 1.4s infinite; }
.legal__water.is-drawn .legal__water-mark::after { transform: scaleY(1); }

/* the H1 row: the title on the left shore, the entity, effective date and contact line filling the right shore */
.legal__head { align-items: end; margin-bottom: clamp(30px, 3.6vw, 68px); }
.legal__h1 { margin: 0; font-size: clamp(3rem, 6.6vw, 10rem); line-height: .98; }
.legal__meta { margin: 0; display: grid; grid-template-columns: auto auto 1fr; gap: 16px clamp(20px, 2.6vw, 56px); align-items: end; padding-bottom: .35em; }
.legal__meta-item { min-width: 0; }
.legal__meta-item dt { margin: 0 0 6px; font-size: .8125rem; color: var(--slate); }
.legal__meta-item dd { margin: 0; font-family: var(--font-head); font-weight: 500; font-size: clamp(1.0625rem, 1.3vw, 1.625rem); font-variation-settings: "wdth" 92; line-height: 1.2; }
.legal__meta-item--contact dd { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; justify-content: flex-end; text-align: right; }
.legal__meta-item--contact { text-align: right; }
.legal__dot { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--iris); transform: translateY(-3px); }

/* the two shores: the sticky index, the one continuous flow */
.legal__shores { align-items: stretch; }
.legal__index { position: sticky; top: calc(var(--header-h) + 28px); }
.legal__index-title { margin: 0 0 14px; display: flex; justify-content: space-between; align-items: baseline; gap: 16px; font-family: var(--font-head); font-weight: 600; font-size: clamp(1.125rem, 1.3vw, 1.5rem); color: var(--raven); }
.legal__index-count { font-family: var(--font-text); font-weight: 400; font-size: .875rem; color: var(--slate); }
.legal__index-list { display: grid; margin: 0; padding: 0; list-style: none; }
.legal__index-list li { border-top: 1px solid var(--rule); }
.legal__index-list li:last-child { border-bottom: 1px solid var(--rule); }
.legal__index-link { display: flex; align-items: baseline; gap: 14px; padding: clamp(7px, .75vw, 12px) 0; font-family: var(--font-head); font-weight: 500; font-size: clamp(1rem, 1.12vw, 1.3125rem); font-variation-settings: "wdth" 92; color: var(--raven); background-image: none !important; text-decoration: none; transition: padding-left var(--dur-base) var(--ease-slack); }
.legal__index-link::before { content: ''; flex: none; width: 8px; height: 8px; border-radius: 50%; border: 1px solid var(--raven); transform: translateY(-2px); transition: background-color var(--dur-fast), border-color var(--dur-fast), box-shadow var(--dur-base) var(--ease-slack), transform var(--dur-base) var(--ease-slack); }
.legal__index-link .t { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='4' viewBox='0 0 12 4'%3E%3Cpath d='M0 2 C 2 0, 4 0, 6 2 S 10 4, 12 2' fill='none' stroke='%23121519' stroke-width='1.2'/%3E%3C/svg%3E"); background-repeat: repeat-x; background-position: 0 100%; background-size: 12px 4px; padding-bottom: 3px; }
.legal__index-link:hover, .legal__index-link:focus-visible { padding-left: 6px; }
.legal__index-link:hover::before, .legal__index-link:focus-visible::before { transform: translateY(-2px) scale(1.35); border-color: var(--iris); }
.legal__index-link:hover .t, .legal__index-link:focus-visible .t { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='4' viewBox='0 0 12 4'%3E%3Cpath d='M0 3 H12' fill='none' stroke='%23121519' stroke-width='1.2'/%3E%3C/svg%3E"); }
.legal__index-link.is-active { font-weight: 600; }
.legal__index-link.is-active::before { background: var(--iris); border-color: var(--iris); box-shadow: 0 0 0 3px var(--iris-tint); }

.legal__text-shore { min-width: 0; }
.legal__prose { column-width: 34ch; column-gap: clamp(32px, 3vw, 72px); column-fill: balance; column-rule: 1px solid transparent; }
.legal__prose p { break-inside: auto; orphans: 3; widows: 3; margin: 0 0 .95em; }
.legal__prose .legal__intro { font-size: clamp(1.0625rem, 1.2vw, 1.3125rem); line-height: 1.5; margin-bottom: 1.2em; }
.legal__sub { break-inside: auto; padding-top: clamp(14px, 1.4vw, 24px); margin-top: clamp(10px, 1vw, 18px); border-top: 1px solid var(--rule); scroll-margin-top: calc(var(--header-h) + 24px); }
.legal__sub:first-of-type { margin-top: 0; }
.legal__h2 { margin: 0 0 .6em; font-family: var(--font-head); font-weight: 600; font-size: clamp(1.1875rem, 1.45vw, 1.75rem); font-variation-settings: "wdth" 90; line-height: 1.15; break-after: avoid; break-inside: avoid; }
.legal__h2:focus { outline: none; }
.legal__sub.is-arrived .legal__h2 { animation: rc-legal-arrive 1.2s var(--ease-slack); }
@keyframes rc-legal-arrive { 0% { color: var(--iris); } 100% { color: inherit; } }
@media (max-width: 1919.98px) { .legal__prose { columns: 1; } }
/* the section picked from the contents: a soft iris wash with a bar on its left edge, drawn outside the box so nothing reflows */
.legal__sub { position: relative; border-radius: 6px; transition: background-color var(--dur-base) var(--ease-slack), box-shadow var(--dur-base) var(--ease-slack); }
.legal__sub::before { content: ''; position: absolute; left: -12px; top: 0; bottom: 0; width: 3px; border-radius: 2px; background: var(--iris); transform: scaleY(0); transform-origin: top; transition: transform var(--dur-base) var(--ease-slack); }
.legal__sub.is-selected { background: rgba(90, 63, 216, .07); box-shadow: 0 0 0 10px rgba(90, 63, 216, .07); }
.legal__sub.is-selected::before { transform: scaleY(1); }
.legal__sub.is-selected .legal__h2 { color: var(--iris-deep); }

@media (max-width: 899.98px) {
  .legal__head { row-gap: 18px; }
  .legal__meta { grid-template-columns: 1fr 1fr; }
  .legal__meta-item--contact { grid-column: 1 / -1; text-align: left; }
  .legal__meta-item--contact dd { justify-content: flex-start; text-align: left; }
  .legal__index { position: static; }
  .legal__index-link { font-size: 1rem; }
}