/* SnowGame /reserve (lessons): the rental page's look (/rental: navy round-capped outlines, flat cyan / pink / yellow fills,
   white cards, coupon tickets with a tear line, navy titles on a cyan brush with a Kalam line) as a kit shared by R1-R5.
   Copied from the /access kit (access-kit.css) and renamed: everything sits under .rs (the page's <main>), classes rs-,
   variables --rs-, keyframes rs-. Travel-only parts (resort cards, badges, leg arrows) are gone; lesson parts (features,
   course card, price table, timeline, notice lines, fee poster frame) are added. How to use: reserve-lab/kit/KIT.md.
   Mobile first: phones up to 767px (navbar 100px up to 479px, 120px from 480px), tablets 768-1023, desktop from 1024,
   wide from 1280. Content keeps 80px clear on each side for the floating contact buttons from 601px. */
.rs {
  --rs-ink: #17375a; --rs-text: #3a5167; --rs-en: #43647c;
  --rs-ice: #eaf6fc; --rs-stub: #e8f6fb; --rs-band: #f3fafd; --rs-line: #d2e4ee; --rs-line-2: #b4d3e3; --rs-edge: #c9dfeb; --rs-perf: #8cc4d8;
  --rs-cyan: #4edce9; --rs-cyan-soft: #cdf3f8; --rs-cyan-pale: #dcf6fa; --rs-cyan-line: #8fe6ef;
  --rs-red: #c81e4a; --rs-blue: #1d6aa8; --rs-blue-2: #14507f;
  --rs-yellow: #ffd75e; --rs-yellow-soft: #fff3c8; --rs-yellow-line: #f6cf4f; --rs-pink: #ff9ec0; --rs-pink-soft: #ffe3ee;
  --rs-snow: #c3e7f2; --rs-dot: #e2f1f8;
  --rs-shadow: 0 14px 28px -22px rgba(23, 55, 90, .5);
  --rs-ease: cubic-bezier(.22, 1, .36, 1);
  --rs-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  --rs-w: min(1120px, calc(100% - 40px));
  --rs-nav: 100px;
  --rs-h2: 26px; --rs-kalam: 32px; --rs-pair: 14px; --rs-body: 16px; --rs-h3s: 20px; --rs-h4s: 18px;
  --rs-sec: 64px; --rs-hd: 28px; --rs-bk: 20px; --rs-h3: 10px;
  display: block; background: #fff; color: var(--rs-text); font-size: var(--rs-body); line-height: 1.75; overflow-x: clip;
}
.rs *, .rs *::before, .rs *::after { box-sizing: border-box; }
.rs [hidden] { display: none !important; }
.rs:focus, .rs:focus-visible { outline: none !important; }
.rs h1, .rs h2, .rs h3, .rs h4, .rs p, .rs ul, .rs ol, .rs dl, .rs dd, .rs figure, .rs blockquote { margin: 0; }
.rs ul, .rs ol { padding: 0; list-style: none; }
.rs h1, .rs h2, .rs h3, .rs h4 { color: var(--rs-ink); font-family: inherit; font-weight: 700; letter-spacing: .02em; text-transform: none; }
.rs strong, .rs b { color: var(--rs-ink); font-weight: 700; }
.rs p, .rs li, .rs dd { text-wrap: pretty; }
.rs a { color: var(--rs-blue); text-underline-offset: 3px; }
.rs img { max-width: 100%; }
.rs svg { display: block; flex-shrink: 0; }
.rs button { font: inherit; }
.rs summary { list-style: none; cursor: pointer; }
.rs summary::-webkit-details-marker { display: none; }
.rs summary::marker { content: ""; }
.rs .rs-keep { display: inline-block; }
.rs .rs-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.rs .rs-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
/* jump targets land under the fixed navbar; controls keep clear of the navbar and the bottom contact buttons */
.rs [id] { scroll-margin-top: calc(var(--rs-nav) + 16px); }
.rs a, .rs button, .rs summary { scroll-margin-top: calc(var(--rs-nav) + 20px); scroll-margin-bottom: 84px; }
/* keyboard focus: a navy ring (clear on white, cyan and yellow); a mouse click shows none */
.rs a:focus-visible, .rs button:focus-visible, .rs summary:focus-visible, .rs [tabindex]:not(main):focus-visible { outline: 3px solid var(--rs-ink); outline-offset: 3px; }
.rs :focus:not(:focus-visible) { outline: none; }
.rs .rs-ico { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* ---------------------------------------------------------------- layout */
.rs .rs-wrap { width: var(--rs-w); margin-inline: auto; }
.rs .rs-sec { padding-top: var(--rs-sec); }
.rs .rs-sec--first { padding-top: 32px; }   /* the first section under the hero */
.rs .rs-sec--last { padding-bottom: var(--rs-sec); }   /* the last section, before the page's closing block */
.rs .rs-rule { height: 0; margin: 0; border: 0; border-top: 1px solid var(--rs-line); }
/* a dotted line with a snowflake in the middle (between the three sections) */
.rs .rs-dots {
  display: block; width: var(--rs-w); height: 26px; margin: var(--rs-sec) auto 0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Ccircle cx='13' cy='13' r='13' fill='%23fff'/%3E%3Cpath d='M13 4.5v17M5.6 8.7l14.8 8.6M5.6 17.3l14.8-8.6' fill='none' stroke='%234edce9' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center / 26px 26px no-repeat,
    radial-gradient(circle, var(--rs-line-2) 1.6px, transparent 2.1px) center / 12px 12px repeat-x;
}

/* ---------------------------------------------------------------- section title: navy Chinese on a cyan brush + Kalam line */
.rs .rs-head { margin-bottom: var(--rs-hd); }
.rs .rs-head__title { position: relative; z-index: 0; display: inline-block; font-size: var(--rs-h2); line-height: 1.5; }
.rs .rs-head__title::after {
  content: ""; position: absolute; z-index: -1; left: -.2em; right: -.2em; top: 68%; height: 30%;
  border-radius: .3em .5em .4em .45em; background: rgba(78, 220, 233, .55); transform: rotate(-1deg); transform-origin: left center;
}
.rs .rs-en { display: block; font-family: Kalam, Arial, sans-serif; font-weight: 700; letter-spacing: 0; color: var(--rs-en); }
.rs .rs-head .rs-en { margin-top: var(--rs-pair); font-size: var(--rs-kalam); line-height: 1; text-wrap: balance; }
.rs .rs-lead { max-width: 38em; margin-bottom: var(--rs-bk); }
.rs .rs-foot { margin-top: var(--rs-hd); }
/* two-column section (>= 1024px): the title stays in view on the left while the content on the right scrolls */
.rs .rs-guide__in { padding: calc(var(--rs-sec) * 1.25) 0 calc(var(--rs-sec) / 2); }
.rs .rs-guide + .rs-guide .rs-guide__in { border-top: 1px solid var(--rs-line); }
.rs .rs-guide__body { min-width: 0; }
/* card / block titles at the site's sizes: h3 20 (22 from 768), h4 18 (20 from 768) */
.rs .rs-h3 { font-size: var(--rs-h3s); line-height: 1.45; }
.rs .rs-h4 { font-size: var(--rs-h4s); line-height: 1.45; }

/* ---------------------------------------------------------------- hero: title + confetti, Kalam line, ribbon, lead; art on the right */
.rs .rs-hero { padding-top: calc(var(--rs-nav) + 40px); }
.rs .rs-hero__inner { position: relative; display: grid; gap: 24px; align-items: center; }
.rs .rs-hero__copy { position: relative; z-index: 1; min-width: 0; }
.rs .rs-deco { position: absolute; inset: 0; z-index: 0; margin: 0; pointer-events: none; }
.rs .rs-hero__title { position: relative; width: fit-content; max-width: 100%; font-size: 33px; line-height: 1.25; letter-spacing: .08em; }
.rs .rs-hero__title::after {
  content: ""; position: absolute; left: 100%; top: 50%; width: 46px; height: 46px; margin: -28px 0 0 2px;
  pointer-events: none; transform-origin: 0 60%; background: center / contain no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke-width='3.6' stroke-linecap='round'%3E%3Cpath d='M6 13.6 11 4.9' stroke='%23ff9ec0'/%3E%3Cpath d='M10.4 18 19.1 13' stroke='%23ffd75e'/%3E%3Cpath d='M12 24h10' stroke='%234edce9'/%3E%3Cpath d='M10.4 30 19.1 35' stroke='%23ff9ec0'/%3E%3Ccircle cx='22.9' cy='6.1' r='2.2' fill='%23ffd75e' stroke='none'/%3E%3C/svg%3E");
}
.rs .rs-hero__en { margin-top: 4px; font-size: 22px; line-height: 1.15; }
.rs .rs-hero__lead { max-width: 30em; margin-top: 12px; }
.rs .rs-hero__art { display: none; }
.rs .rs-hero__svg { width: 100%; height: auto; }
/* phones: a small drawing right of the Kalam line and the ribbon (the seven-character title fills the first line) */
.rs .rs-hero__mini { position: absolute; top: 50px; right: -6px; width: clamp(78px, calc(100vw - 292px), 104px); height: auto; aspect-ratio: 3 / 2; }
/* snow: pale and cyan dots and one small flake around the words */
.rs .rs-fl { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--rs-snow); }
.rs .rs-fl--2, .rs .rs-fl--5 { width: 5px; height: 5px; background: var(--rs-cyan); }
.rs .rs-fl--3 {
  width: 12px; height: 12px; border-radius: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234edce9' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M12 2.5v19M3.8 7.2l16.4 9.6M3.8 16.8l16.4-9.6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.rs .rs-fl--1 { top: -6px; right: 30px; }
.rs .rs-fl--2 { top: 52px; left: 168px; }
.rs .rs-fl--3 { top: 140px; right: 8px; }
.rs .rs-fl--4 { top: 150px; right: 64px; width: 6px; height: 6px; }
.rs .rs-fl--5 { top: 26px; right: 2px; }
/* ribbon (pink band, navy outline, swallow-tailed ends tucked behind): <p class="rs-ribbon"><span class="rs-ribbon__band"> */
.rs .rs-ribbon { position: relative; z-index: 0; isolation: isolate; display: block; width: fit-content; max-width: calc(100% - 24px); margin: 10px 12px 4px; }
.rs .rs-ribbon__band {
  position: relative; display: block; padding: 4px 14px; border: 2px solid var(--rs-ink); border-radius: 2px;
  background: linear-gradient(#ffd9e6, #ffc9dc); text-align: center; font-size: 18px; font-weight: 700; line-height: 1.5; color: var(--rs-ink);
}
.rs .rs-ribbon__band::before, .rs .rs-ribbon__band::after { content: ""; position: absolute; z-index: -1; top: 5px; bottom: -5px; width: 26px; pointer-events: none; }
.rs .rs-ribbon__band::before {
  left: -14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 40' preserveAspectRatio='none'%3E%3Cpath d='M1 1H25V39H1L8.5 20Z' fill='%23ffb3cc' stroke='%2317375a' stroke-width='2' stroke-linejoin='round' vector-effect='non-scaling-stroke'/%3E%3Cpath d='M14 34.2H25V39H14Z' fill='%23e98bae'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
}
.rs .rs-ribbon__band::after {
  right: -14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 40' preserveAspectRatio='none'%3E%3Cpath d='M25 1H1V39H25L17.5 20Z' fill='%23ffb3cc' stroke='%2317375a' stroke-width='2' stroke-linejoin='round' vector-effect='non-scaling-stroke'/%3E%3Cpath d='M12 34.2H1V39H12Z' fill='%23e98bae'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
}

/* ---------------------------------------------------------------- cards: white card, coupon ticket (tear line + tinted stub) */
.rs .rs-card { position: relative; min-width: 0; padding: 20px; border: 1.5px solid var(--rs-line); border-radius: 20px; background: #fff; box-shadow: var(--rs-shadow); }
.rs .rs-ticket { position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; background: #fff; border-radius: 20px; box-shadow: var(--rs-shadow); }
.rs .rs-ticket::after { content: ""; position: absolute; inset: 0; border: 1.5px solid var(--rs-edge); border-radius: inherit; pointer-events: none; }
.rs .rs-ticket__main { flex: 1 1 auto; min-width: 0; padding: 16px; }
.rs .rs-ticket__stub { position: relative; padding: 12px 16px 16px; background: var(--rs-stub); border-top: 2px dashed var(--rs-perf); }
/* the two notches show the page's white, with the ticket's edge line around them */
.rs .rs-ticket__stub::before, .rs .rs-ticket__stub::after {
  content: ""; position: absolute; z-index: 1; top: -13px; width: 24px; height: 24px;
  border-radius: 50%; background: #fff; border: 1.5px solid var(--rs-edge);
}
.rs .rs-ticket__stub::before { left: -12px; }
.rs .rs-ticket__stub::after { right: -12px; }
/* sideways ticket: stub on the right, the tear line runs top to bottom (the rental tickets at 768-1279px) */
.rs .rs-ticket--row { flex-direction: row; }
.rs .rs-ticket--row > .rs-ticket__stub { flex: 0 0 auto; display: flex; flex-direction: column; justify-content: center; border-top: 0; border-left: 2px dashed var(--rs-perf); }
.rs .rs-ticket--row > .rs-ticket__stub::before, .rs .rs-ticket--row > .rs-ticket__stub::after { left: -13px; right: auto; }
.rs .rs-ticket--row > .rs-ticket__stub::before { top: -12px; }
.rs .rs-ticket--row > .rs-ticket__stub::after { top: auto; bottom: -12px; }
.rs .rs-ticket__label { font-size: 15px; font-weight: 700; line-height: 1.4; color: var(--rs-text); }
/* the big word top right (the rental tickets' 「9 折」), in navy */
.rs .rs-ticket__big { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; gap: 2px; margin-left: auto; color: var(--rs-ink); font-size: 22px; font-weight: 800; line-height: 1.3; letter-spacing: .04em; white-space: nowrap; }
/* big figures (time / fare): a small clock / yen icon (or a 15px label), then the value: lead words small, the number
   enlarged (fare in red, like the rental tickets' 「9 折」), a second value on its own smaller line; words stay in order */
.rs .rs-figs { display: grid; gap: 6px 16px; }
.rs .rs-fig { display: flex; align-items: flex-start; column-gap: 10px; min-width: 0; color: var(--rs-ink); line-height: 1.3; }
.rs .rs-fig__k { flex: 0 0 auto; min-width: 4.4em; padding-top: .55em; font-size: 15px; font-weight: 700; color: var(--rs-text); }
.rs .rs-fig__i { flex: 0 0 auto; padding-top: 5px; }
.rs .rs-fig__v { min-width: 0; font-size: 18px; font-weight: 700; overflow-wrap: anywhere; }
.rs .rs-num { font-size: 1.75em; font-weight: 800; letter-spacing: .01em; line-height: 1.1; }
.rs .rs-num--zh { font-size: 1.35em; }   /* 三個半: Chinese numerals read heavier than digits */
.rs .rs-fig--fare .rs-num { color: var(--rs-red); }
.rs .rs-fig__q { margin-right: 4px; font-size: 15px; font-weight: 700; }
.rs .rs-fig__core { white-space: nowrap; }   /* the number never parts from its unit (1,200｜日幣) */
.rs .rs-fig__more { display: block; margin-top: 2px; font-size: 15px; font-weight: 700; line-height: 1.5; color: var(--rs-text); }

/* ---------------------------------------------------------------- round icons, icon rows, four tips */
.rs .rs-ic { display: grid; place-items: center; flex: 0 0 auto; width: 56px; height: 56px; border-radius: 50%; background: var(--rs-ice); }
.rs .rs-ic svg { width: 40px; height: 40px; fill: none; stroke: var(--rs-ink); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rs .rs-ic--md { width: 44px; height: 44px; }
.rs .rs-ic--md svg { width: 30px; height: 30px; stroke-width: 1.9; }
.rs .rs-ic--sm { width: 28px; height: 28px; }
.rs .rs-ic--sm svg { width: 20px; height: 20px; stroke-width: 1.8; }
.rs .rs-ic--yellow { background: var(--rs-yellow-soft); }
.rs .rs-ic--pink { background: var(--rs-pink-soft); }
.rs .rs-ic--white { background: #fff; box-shadow: inset 0 0 0 1.5px var(--rs-line-2); }
.rs .rs-points { display: grid; gap: 8px; line-height: 1.5; }
.rs .rs-points > li { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.rs .rs-points > li > .rs-ic--sm { margin-top: calc((1.5em - 28px) / 2); }
.rs .rs-kv { display: flex; gap: 8px; min-width: 0; }
.rs .rs-kv__k { flex: 0 0 auto; min-width: 4.4em; color: var(--rs-ink); font-weight: 700; }
.rs .rs-kv__v { min-width: 0; }
.rs .rs-tips { display: grid; gap: calc(var(--rs-bk) + 8px); }
.rs .rs-tip { display: flex; align-items: flex-start; gap: 14px; }
.rs .rs-tip__title { font-size: 18px; line-height: 1.5; }
.rs .rs-tip p { max-width: 38em; margin-top: var(--rs-h3); }

/* ---------------------------------------------------------------- tinted panels (cyan / yellow / blue) with round picture tiles */
.rs .rs-boxes { display: grid; gap: 16px; }
.rs .rs-box { min-width: 0; padding: 20px; border: 1.5px solid var(--rs-perf); border-radius: 20px; background: #eafafd; color: var(--rs-ink); }
.rs .rs-box--yellow { border-color: #e5c469; background: #fff6d6; }
.rs .rs-box--blue { border-color: #9cc9e3; background: #f1f7fd; }
.rs .rs-box__head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 18px; font-weight: 700; line-height: 1.5; color: var(--rs-ink); }
.rs .rs-box__icon { width: 28px; height: 28px; }
.rs .rs-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(68px, 1fr)); gap: 14px 4px; margin-top: 16px; }
.rs .rs-tile {
  display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; margin: 0; padding: 6px 2px 8px;
  border: 0; border-radius: 16px; background: none; color: var(--rs-ink); font-size: 16px; line-height: 1.35;
  text-align: center; text-decoration: none; word-break: keep-all; overflow-wrap: anywhere;
}
.rs button.rs-tile, .rs a.rs-tile { cursor: pointer; transition: background-color .3s; }
.rs button.rs-tile:hover, .rs a.rs-tile:hover { background: rgba(255, 255, 255, .75); }
.rs .rs-tile[aria-pressed="true"], .rs .rs-tile[aria-current="true"], .rs .rs-tile[aria-selected="true"] { background: var(--rs-cyan-soft); font-weight: 800; }
.rs .rs-tile__art { display: grid; place-items: center; width: 52px; height: 52px; padding: 5px; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1.5px var(--rs-line-2); }
.rs .rs-tile__art, .rs .rs-tile__art svg { fill: none; stroke: var(--rs-ink); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.rs .rs-tile__art > svg { width: 100%; height: 100%; }
.rs .rs-box--yellow .rs-tile__art { box-shadow: inset 0 0 0 1.5px #edc3d3; }

/* ---------------------------------------------------------------- segmented switch (navy capsule = chosen) */
.rs .rs-seg { display: flex; gap: 4px; padding: 4px; border-radius: 999px; background: #eef4f8; }
.rs .rs-seg__btn {
  flex: 1 1 0; min-width: 0; min-height: 44px; padding: 6px 14px; border: 0; border-radius: 999px; background: transparent; color: var(--rs-text);
  font-weight: 700; line-height: 1.3; cursor: pointer; transition: background-color .3s, color .3s;
}
.rs .rs-seg__btn:hover { background: #e0ebf2; }
.rs .rs-seg__btn[aria-selected="true"], .rs .rs-seg__btn[aria-pressed="true"] { background: var(--rs-ink); color: #fff; }

/* ---------------------------------------------------------------- folding groups (the rental notice, version d) */
.rs .rs-acc { display: grid; gap: 12px; }
.rs .rs-acc__sum {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; padding: 10px 10px 10px 18px;
  border-radius: 16px; background: var(--rs-band); box-shadow: inset 0 0 0 1.5px var(--rs-line);
  font-size: 18px; font-weight: 700; line-height: 1.5; color: var(--rs-ink); transition: background-color .3s ease, color .3s ease;
}
.rs .rs-acc__sum:hover { background: #e3f4fa; }
.rs .rs-acc__chev { flex: 0 0 auto; width: 40px; height: 40px; transition: transform .3s; }
.rs .rs-acc__item[open] > .rs-acc__sum .rs-acc__chev { transform: rotate(180deg); }
.rs .rs-acc__item.is-closing > .rs-acc__sum .rs-acc__chev { transform: none; }
.rs .rs-acc__item[open]:not(.is-closing) > .rs-acc__sum { background: var(--rs-cyan-soft); color: var(--rs-blue); }
.rs .rs-acc__body { padding: 16px 4px 10px; }

/* ---------------------------------------------------------------- a short timeline (the rental process): dots on a line */
.rs .rs-flow { --rs-c: var(--rs-cyan); --rs-c-soft: var(--rs-cyan-pale); --rs-c-line: var(--rs-cyan-line); }
.rs .rs-flow--yellow { --rs-c: var(--rs-yellow); --rs-c-soft: var(--rs-yellow-soft); --rs-c-line: var(--rs-yellow-line); }
.rs .rs-flow__step { position: relative; padding: 0 0 var(--rs-bk) 30px; }
.rs .rs-flow__step:last-child { padding-bottom: 0; }
.rs .rs-flow__step::before {
  content: ""; position: absolute; z-index: 1; left: 1px; top: 8px; width: 14px; height: 14px;
  border: 2.5px solid var(--rs-ink); border-radius: 50%; background: var(--rs-c); box-shadow: 0 0 0 3px #fff;
}
.rs .rs-flow__step:not(:last-child)::after { content: ""; position: absolute; left: 6.5px; top: 15px; bottom: -15px; width: 3px; border-radius: 2px; background: var(--rs-c-line); transform-origin: top; }
.rs .rs-flow__head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.rs .rs-flow__stage { display: inline-block; padding: 1px 10px; border-radius: 999px; background: var(--rs-c-soft); font-size: 15px; font-weight: 700; line-height: 1.6; color: var(--rs-ink); }

/* ---------------------------------------------------------------- small bits: tags, count pill, washi label, pills, notes, dots list */
.rs .rs-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.rs .rs-tag { font-family: var(--rs-sans); letter-spacing: .02em; display: inline-flex; align-items: center; gap: 4px; padding: 1px 10px; border-radius: 999px; background: var(--rs-ice); color: var(--rs-ink); font-size: 15px; font-weight: 700; line-height: 1.6; }
.rs .rs-tag--cyan { background: var(--rs-cyan-pale); }
.rs .rs-tag--yellow { background: var(--rs-yellow-soft); }
.rs .rs-tag--pink { background: var(--rs-pink-soft); }
.rs .rs-tag--line { background: #fff; box-shadow: inset 0 0 0 1.5px var(--rs-line-2); }
.rs .rs-count { font-family: var(--rs-sans); letter-spacing: .02em; vertical-align: .15em; display: inline-block; padding: 1px 10px; border-radius: 999px; background: var(--rs-ink); color: #fff; font-size: 15px; font-weight: 700; line-height: 1.4; white-space: nowrap; }
.rs .rs-washi {
  display: inline-block; padding: 1px 14px; rotate: -4deg;
  background: repeating-linear-gradient(-45deg, rgba(78, 220, 233, .42) 0 6px, rgba(78, 220, 233, .26) 6px 12px);
  font-family: Kalam, Arial, sans-serif; font-size: 18px; font-weight: 700; line-height: 1.4; color: var(--rs-en);
}
.rs .rs-washi--pink { rotate: 3deg; background: repeating-linear-gradient(-45deg, rgba(255, 158, 192, .45) 0 6px, rgba(255, 158, 192, .28) 6px 12px); }
.rs .rs-pill { display: flex; align-items: flex-start; gap: 8px; padding: 8px 14px; border-radius: 14px; background: var(--rs-cyan-pale); font-weight: 700; line-height: 1.55; color: var(--rs-ink); }
.rs .rs-pill--yellow { background: var(--rs-yellow-soft); }
.rs .rs-pill > svg { width: 20px; height: 20px; margin-top: calc((1.55em - 20px) / 2); fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* notes inside a way of travel: ⚠️ pale yellow + warning icon, ✔️ pale cyan + tick (icons carry role="img" aria-label) */
.rs .rs-note { display: flex; align-items: flex-start; gap: 10px; padding: 10px 14px; border: 1.5px solid #e5b83e; border-left-width: 5px; border-radius: 14px; background: #fff6d6; color: var(--rs-ink); font-weight: 700; line-height: 1.75; }
.rs .rs-note--ok { border-color: var(--rs-cyan-line); border-left-color: #35c3d2; background: #e6f9fb; }
.rs .rs-note__ic { flex: 0 0 auto; display: block; width: 24px; height: 24px; margin-top: calc((1.75em - 24px) / 2); }
.rs .rs-note__ic svg { width: 24px; height: 24px; fill: none; stroke: var(--rs-ink); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rs .rs-note + .rs-note { margin-top: 8px; }
.rs .rs-warn { display: flex; align-items: flex-start; gap: 12px; padding: 16px; border: 1.5px solid #e5b83e; border-left-width: 5px; border-radius: 16px; background: #fff6d6; color: var(--rs-ink); }
.rs .rs-dotlist { display: grid; gap: 10px; }
.rs .rs-dotlist > li { position: relative; padding-left: 18px; }
.rs .rs-dotlist > li::before { content: ""; position: absolute; left: 2px; top: .7em; width: 7px; height: 7px; border-radius: 50%; background: var(--rs-cyan); }

/* ---------------------------------------------------------------- decorations: washi tape, lift-ticket tag (aria-hidden, use sparingly) */
.rs .rs-tape {
  position: absolute; z-index: 2; width: 64px; height: 18px; pointer-events: none;
  background: radial-gradient(circle, rgba(255, 255, 255, .85) 1.2px, transparent 1.7px) 2px 2px / 8px 8px, rgba(255, 158, 192, .45);
  clip-path: polygon(3px 0, calc(100% - 3px) 0, 100% 12.5%, calc(100% - 3px) 25%, 100% 37.5%, calc(100% - 3px) 50%, 100% 62.5%,
    calc(100% - 3px) 75%, 100% 87.5%, calc(100% - 3px) 100%, 3px 100%, 0 87.5%, 3px 75%, 0 62.5%, 3px 50%, 0 37.5%, 3px 25%, 0 12.5%);
}
.rs .rs-tape--cyan { background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .55) 0 3px, transparent 3px 8px), rgba(78, 220, 233, .42); }
.rs .rs-tape--tl { top: 4px; left: -17px; rotate: -38deg; }
.rs .rs-tape--tr { top: 4px; right: -17px; rotate: 38deg; }
.rs .rs-liftag {
  position: relative; display: grid; place-items: end center; width: 28px; height: 38px; padding-bottom: 5px;
  border: 2px solid var(--rs-ink); border-radius: 6px; rotate: 8deg; transform-origin: 50% -14px;
  background:
    radial-gradient(circle at 50% 6px, #fff 0 2.4px, var(--rs-ink) 2.6px 3.7px, transparent 4px),
    linear-gradient(90deg, var(--rs-ink) 55%, transparent 0) 0 11px / 4.4px 1.6px repeat-x,
    repeating-linear-gradient(-45deg, rgba(255, 255, 255, .35) 0 2px, transparent 2px 5px) 0 0 / 100% 11px no-repeat,
    linear-gradient(var(--rs-tag, var(--rs-cyan)) 0 11px, #fff 0);
  color: var(--rs-ink); font-family: Kalam, Arial, sans-serif; font-size: 17px; font-weight: 700; line-height: 1;
}
.rs .rs-liftag--yellow { --rs-tag: var(--rs-yellow); }
.rs .rs-liftag--pink { --rs-tag: var(--rs-pink); }
.rs .rs-liftag::before {
  content: ""; position: absolute; left: 50%; top: -17px; width: 10px; height: 24px; margin-left: -5px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 24'%3E%3Cpath d='M5 .5 2.3 20.5Q5 24.2 7.7 20.5Z' fill='none' stroke='%2317375a' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}

/* ---------------------------------------------------------------- buttons: blue capsule (main), white capsule with a blue line */
.rs .rs-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 8px 22px;
  border: 2px solid transparent; border-radius: 999px; background: var(--rs-blue); color: #fff;
  font-size: 16px; font-weight: 700; line-height: 1.35; text-align: center; text-decoration: none; cursor: pointer; transition: background-color .3s;
}
.rs .rs-btn:hover { background: var(--rs-blue-2); color: #fff; }
.rs .rs-btn--ink { background: var(--rs-ink); }
.rs .rs-btn-o {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 8px 20px;
  border: 2px solid var(--rs-blue); border-radius: 999px; background: #fff; color: var(--rs-blue);
  font-size: 16px; font-weight: 700; line-height: 1.35; text-align: center; text-decoration: none; cursor: pointer; transition: background-color .3s, color .3s;
}
.rs .rs-btn-o:hover { background: var(--rs-blue); color: #fff; }
.rs .rs-btn--block, .rs .rs-btn-o--block { display: flex; width: 100%; }
.rs .rs-btns { display: flex; flex-wrap: wrap; gap: 10px; }
.rs .rs-btns > a { flex: 1 1 140px; }

/* ---------------------------------------------------------------- shared dialog (<dialog data-rs-dialog>), drawn as a ticket.
   The content comes from a <details class="rs-pop" data-rs-modal>: its body moves in while open and back when it closes. */
.rs .rs-dialog {
  width: min(640px, calc(100% - 24px)); max-width: none; max-height: calc(100% - 24px); margin: auto; padding: 0; border: 0; border-radius: 20px;
  background: #fff; color: var(--rs-text); box-shadow: 0 24px 60px -24px rgba(23, 55, 90, .6); overflow: auto; overscroll-behavior: contain;
  font-size: var(--rs-body); font-weight: 400; line-height: 1.75; letter-spacing: normal; text-align: left; white-space: normal;
}
.rs .rs-dialog::backdrop { background: rgba(23, 55, 90, .45); }
.rs .rs-dialog[open] { animation: rs-dlg-in .3s var(--rs-ease); }
@keyframes rs-dlg-in { from { opacity: 0; translate: 0 12px; } }
.rs .rs-dialog__close {
  position: sticky; z-index: 3; top: 10px; display: grid; place-items: center; width: 44px; height: 44px; margin: 10px 10px -54px auto; padding: 0;
  border: 0; border-radius: 50%; background: #fff; color: var(--rs-ink); box-shadow: inset 0 0 0 1.5px var(--rs-line-2), 0 6px 14px -8px rgba(23, 55, 90, .5);
  cursor: pointer; transition: background-color .3s;
}
.rs .rs-dialog__close:hover { background: var(--rs-ice); }
.rs .rs-dialog__close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; }
.rs .rs-dialog__top { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 16px 64px 12px 20px; }
.rs .rs-dialog__title { min-width: 0; font-size: 22px; font-weight: 700; line-height: 1.35; color: var(--rs-ink); overflow-wrap: anywhere; }
.rs .rs-pop__main { padding: 4px 0 16px; }
.rs .rs-pop__stub { position: relative; padding: 14px 16px 16px; border-radius: 0 0 16px 16px; background: var(--rs-stub); border-top: 2px dashed var(--rs-perf); }
.rs .rs-dialog .rs-pop__main { padding: 0 20px 20px; }
.rs .rs-dialog .rs-pop__stub { padding: 16px 20px 22px; border-radius: 0; }

/* ---------------------------------------------------------------- motion: only after reserve-kit.js adds .rs-motion (never without
   JS or with reduced motion). Owner 11/07: starts the moment a part comes into view, the main content shows within about
   0.5s, a whole part is done in 1-1.2s, delays at most 0.2s, small moves (<= 12px). Accents replay each time a part comes
   back into view (after leaving it for 600ms or more); words never fade or move, except cards marked
   data-rs-reveal="once", which rise in the first time only. */
.rs.rs-motion .rs-head[data-rs-reveal] .rs-head__title::after { transform: rotate(-1deg) scaleX(0); }
.rs.rs-motion .rs-head[data-rs-reveal].is-on .rs-head__title::after { transform: rotate(-1deg) scaleX(1); transition: transform .8s var(--rs-ease); }
.rs.rs-motion .rs-deco[data-rs-reveal]:not(.is-on) ~ .rs-hero__copy .rs-hero__title::after { opacity: 0; scale: .3; }
.rs.rs-motion .rs-deco[data-rs-reveal].is-on ~ .rs-hero__copy .rs-hero__title::after { transition: scale .7s var(--rs-ease) .1s, opacity .4s .1s; }
.rs.rs-motion .rs-deco[data-rs-reveal]:not(.is-on) .rs-fl { opacity: 0; translate: 0 -12px; }
.rs.rs-motion .rs-deco[data-rs-reveal].is-on .rs-fl { transition: translate .9s var(--rs-ease) .1s, opacity .5s .1s; }
.rs.rs-motion .rs-deco[data-rs-reveal].is-on .rs-fl--2 { transition-delay: .13s; }
.rs.rs-motion .rs-deco[data-rs-reveal].is-on .rs-fl--3 { transition-delay: .16s; }
.rs.rs-motion .rs-deco[data-rs-reveal].is-on .rs-fl--4 { transition-delay: .18s; }
.rs.rs-motion .rs-deco[data-rs-reveal].is-on .rs-fl--5 { transition-delay: .2s; }
/* things hanging in the drawings swing once when they come into view (1.1s, no loop) */
.rs .rs-swing { transform-box: view-box; transform-origin: var(--rs-pivot, 50% 0); }
.rs.rs-motion [data-rs-reveal].is-on .rs-swing { animation: rs-swing 1.1s ease-out .1s both; }
@keyframes rs-swing { 0% { rotate: 0deg; } 18% { rotate: 8deg; } 45% { rotate: -5deg; } 70% { rotate: 2.4deg; } 88% { rotate: -1deg; } 100% { rotate: 0deg; } }
.rs.rs-motion [data-rs-reveal="once"]:not(.is-on) { opacity: 0; translate: 0 12px; }
.rs.rs-motion [data-rs-reveal="once"].is-on { transition: opacity .7s var(--rs-ease) var(--rs-delay, 0s), translate .9s var(--rs-ease) var(--rs-delay, 0s); }

/* ---------------------------------------------------------------- sizes */
@media (max-width: 389px) {
  .rs .rs-ribbon { margin-inline: 10px; }
  .rs .rs-ribbon__band { padding-inline: 12px; }
  .rs .rs-ribbon__band::before { left: -12px; width: 23px; }
  .rs .rs-ribbon__band::after { right: -12px; width: 23px; }
}
@media (max-width: 374px) {
  .rs .rs-ribbon__band { font-size: 17px; }
}
@media (max-width: 360px) {
  .rs { --rs-w: calc(100% - 32px); }
}
@media (max-width: 340px) {
  .rs .rs-hero__mini, .rs .rs-fl--3, .rs .rs-fl--4 { display: none; }
  .rs .rs-ribbon__band { font-size: 16px; }
}
@media (min-width: 480px) {
  .rs { --rs-nav: 120px; }
}
@media (min-width: 601px) and (max-width: 1279px) {
  .rs { --rs-w: calc(100% - 160px); }
}
/* large phones and the 703px preview: more room on the right, so the small drawing grows */
@media (min-width: 600px) and (max-width: 767px) {
  .rs .rs-hero__mini { top: 40px; width: 140px; }
}
@media (min-width: 720px) {
  .rs .rs-boxes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 768px) {
  .rs { --rs-h2: 28px; --rs-kalam: 28px; --rs-pair: 2px; --rs-sec: 48px; --rs-hd: 16px; --rs-bk: 16px; --rs-h3: 2px; --rs-h3s: 22px; --rs-h4s: 20px; }
  .rs .rs-head__title { line-height: 1.4; }
  .rs .rs-head .rs-en { line-height: 1.15; text-wrap: wrap; }
  .rs .rs-sec--first { padding-top: 24px; }
  .rs .rs-guide__in { padding: calc(var(--rs-sec) / 2) 0; }
  .rs .rs-hero { padding-top: calc(var(--rs-nav) + 16px); }
  .rs .rs-hero__inner { grid-template-columns: minmax(0, 1.4fr) minmax(0, .6fr); gap: 28px; }
  .rs .rs-hero__title { font-size: 48px; letter-spacing: .02em; }
  .rs .rs-hero__title::after { width: 52px; height: 52px; margin: -31px 0 0 4px; }
  .rs .rs-ribbon { margin: 14px 16px 8px; }
  .rs .rs-ribbon__band { padding: 6px 20px; font-size: 21px; }
  .rs .rs-ribbon__band::before, .rs .rs-ribbon__band::after { top: 6px; bottom: -6px; width: 32px; }
  .rs .rs-ribbon__band::before { left: -18px; }
  .rs .rs-ribbon__band::after { right: -18px; }
  .rs .rs-hero__art { display: block; width: 100%; max-width: 300px; justify-self: end; }
  .rs .rs-hero__mini { display: none; }
  .rs .rs-fl { left: auto; }
  .rs .rs-fl--1, .rs .rs-fl--2, .rs .rs-fl--3 { display: none; }   /* tablets: the long title fills the copy column */
  .rs .rs-fl--4 { top: -8px; right: 26px; }
  .rs .rs-fl--5 { top: 132px; right: -10px; }
  .rs .rs-tips { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 40px; }
  .rs .rs-acc { gap: 10px; }
  .rs .rs-dialog__top { padding: 22px 70px 14px 28px; }
  .rs .rs-dialog__title { font-size: 24px; }
  .rs .rs-dialog .rs-pop__main { padding: 0 28px 24px; }
  .rs .rs-dialog .rs-pop__stub { padding: 18px 28px 26px; }
}
@media (min-width: 1024px) {
  .rs { --rs-body: 17px; --rs-sec: 64px; --rs-hd: 24px; }
  .rs .rs-sec--first { padding-top: 32px; }
  .rs .rs-hero__inner { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 32px; }
  .rs .rs-hero__title { letter-spacing: .06em; }
  .rs .rs-hero__art { max-width: 330px; }
  .rs .rs-fl--1, .rs .rs-fl--2, .rs .rs-fl--3 { display: block; }   /* as on the rental page: just left of the drawing */
  .rs .rs-fl--1 { top: 6px; right: 356px; }
  .rs .rs-fl--2 { top: 104px; right: 366px; }
  .rs .rs-fl--3 { top: 170px; right: 344px; width: 16px; height: 16px; }
  .rs .rs-tips { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
  .rs .rs-tip { flex-direction: column; gap: 12px; }
  .rs .rs-guide__in { display: grid; grid-template-columns: 260px minmax(0, 1fr); column-gap: 56px; align-items: start; }
  .rs .rs-guide__in > .rs-head { position: sticky; top: 160px; margin-bottom: 0; }
}
@media (min-width: 1280px) {
  .rs { --rs-h2: 30px; --rs-kalam: 32px; }
  .rs .rs-hero__title { font-size: 52px; letter-spacing: .08em; }
}
@media (prefers-reduced-motion: reduce) {
  .rs *, .rs *::before, .rs *::after { transition: none !important; animation: none !important; }
}
/* ==== reserve parts (lesson page) ==================================================================================== */
/* visually hidden copy (still in the text): the course / time repeated inside the second price of a course, so every
   [data-rv-price] holds its own course and time while the eye sees them once */
.rs .rs-vh { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ---------------------------------------------------------------- six features (rental four tips: round icon + h3 + one line) */
.rs .rs-feats { display: grid; gap: 22px; }
.rs .rs-feat { display: flex; align-items: flex-start; gap: 14px; min-width: 0; }
.rs .rs-feat__body { min-width: 0; }
.rs .rs-feat__title { font-size: 18px; line-height: 1.5; }
.rs .rs-feat__en { font-family: Kalam, Arial, sans-serif; font-weight: 700; color: var(--rs-en); letter-spacing: 0; white-space: nowrap; }
.rs .rs-feat__text { margin-top: 2px; }
/* round tiles (rental add-ons): the same six as a grid of round pictures */
.rs .rs-feats--tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 14px; }
.rs .rs-feats--tiles .rs-feat { flex-direction: column; align-items: center; gap: 8px; text-align: center; }

/* ---------------------------------------------------------------- course card (snowboard / ski): name + summary + rider, three items */
.rs .rs-course { display: flex; flex-direction: column; gap: 14px; }
.rs .rs-course__top { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.rs .rs-course__name { display: flex; align-items: center; gap: 10px; font-size: var(--rs-h3s); line-height: 1.4; }
.rs .rs-course__sum { margin-top: 8px; }
.rs .rs-course__img { width: clamp(96px, 26vw, 132px); height: auto; }
.rs .rs-items { display: grid; gap: 12px; }
.rs .rs-item { display: grid; gap: 2px; padding-left: 18px; position: relative; }
.rs .rs-item::before { content: ""; position: absolute; left: 2px; top: .7em; width: 8px; height: 8px; border-radius: 50%; background: var(--rs-cyan); }
.rs .rs-item dt { color: var(--rs-ink); font-weight: 700; }
.rs .rs-item dd { margin: 0; }
/* "learn more" fold inside a card (in place; no JS = native details) */
.rs .rs-more { border-top: 1.5px dashed var(--rs-line-2); padding-top: 10px; }
.rs .rs-more__sum { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--rs-blue); font-weight: 700; }
.rs .rs-more__sum .rs-ico { transition: transform .3s; transform: rotate(90deg); }
.rs .rs-more[open] > .rs-more__sum .rs-ico { transform: rotate(-90deg); }
.rs .rs-more__close, .rs .rs-more[open] > .rs-more__sum .rs-more__open { display: none; }
.rs .rs-more[open] > .rs-more__sum .rs-more__close { display: inline; }
.rs .rs-more .rs-items { padding: 6px 0 4px; }

/* ---------------------------------------------------------------- price table (a white card with a table) and big prices */
.rs .rs-price { color: var(--rs-red); font-size: 26px; font-weight: 800; line-height: 1.2; letter-spacing: .01em; white-space: nowrap; }
.rs .rs-tablecard { padding: 0; overflow: hidden; }
.rs .rs-table { width: 100%; border-collapse: collapse; color: var(--rs-text); line-height: 1.5; }
.rs .rs-table caption { padding: 14px 16px 0; text-align: left; }
.rs .rs-table th, .rs .rs-table td { padding: 12px 14px; border-top: 1px solid var(--rs-line); text-align: left; vertical-align: middle; font-weight: 400; }
.rs .rs-table thead th { border-top: 0; background: var(--rs-band); color: var(--rs-ink); font-size: 15px; font-weight: 700; white-space: nowrap; }
.rs .rs-table tbody th { color: var(--rs-ink); font-weight: 700; }
.rs .rs-table tbody + tbody { border-top: 2px solid var(--rs-line-2); }
.rs .rs-table .rs-price { font-size: 22px; }
.rs .rs-time { display: grid; gap: 0; }
.rs .rs-time__main { color: var(--rs-ink); font-weight: 700; white-space: nowrap; }
.rs .rs-time__sub { font-size: 15px; }
/* phones: the table stacks (each price a row card) */
@media (max-width: 599px) {
  .rs .rs-table--multi th, .rs .rs-table--multi td { padding: 8px 8px; }
  .rs .rs-table--price thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .rs .rs-table--price, .rs .rs-table--price tbody, .rs .rs-table--price tr, .rs .rs-table--price th, .rs .rs-table--price td { display: block; }
  .rs .rs-table--price tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; padding: 10px 16px; border-top: 1px solid var(--rs-line); }
  .rs .rs-table--price tbody > tr:first-child { border-top: 0; }
  .rs .rs-table--price th, .rs .rs-table--price td { padding: 2px 0; border: 0; }
  .rs .rs-table--price tr > [data-rv-price-course], .rs .rs-table--price tr > .rs-table__time { grid-column: 1 / -1; }
}

/* ---------------------------------------------------------------- billing notes (pale blue box) and the fee poster frame */
.rs .rs-billing { display: grid; gap: 8px; padding: 14px 16px; border: 1.5px solid var(--rs-cyan-line); border-radius: 16px; background: #eafafd; color: var(--rs-ink); line-height: 1.7; }
.rs .rs-billing > p { display: flex; align-items: flex-start; gap: 10px; }
.rs .rs-billing .rs-ic--sm { margin-top: calc((1.7em - 28px) / 2); }
.rs .rs-art { max-width: 600px; padding: 12px; }
.rs .rs-art picture, .rs .rs-art img { display: block; width: 100%; height: auto; border-radius: 12px; }
.rs .rs-table--multi { border-collapse: separate; border-spacing: 0; margin-top: 12px; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1.5px #e5c469; overflow: hidden; }
.rs .rs-table--multi thead th { background: #fff3c8; }
.rs .rs-table--multi tbody th, .rs .rs-table--multi td { border-top: 1px solid #f0dfa8; }
.rs .rs-multi__title { display: flex; align-items: center; gap: 10px; }
.rs .rs-multi__note { margin-top: 10px; font-size: 16px; }
.rs .rs-off { color: var(--rs-red); font-weight: 800; white-space: nowrap; }

/* ---------------------------------------------------------------- timeline (a line with big numbered dots: process) */
.rs .rs-tl__title { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; font-size: var(--rs-h3s); line-height: 1.4; }
.rs .rs-tl__steps { position: relative; display: grid; gap: 0; }
.rs .rs-tl__step { position: relative; min-width: 0; padding: 0 0 22px 58px; }
.rs .rs-tl__step:last-child { padding-bottom: 0; }
.rs .rs-tl__step:not(:last-child)::before { content: ""; position: absolute; left: 20px; top: 40px; bottom: 0; width: 3px; border-radius: 2px; background: var(--rs-cyan-line); }
.rs .rs-tl__dot {
  position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 42px; height: 42px; border: 2.5px solid var(--rs-ink);
  border-radius: 50%; background: var(--rs-cyan); color: var(--rs-ink); font-size: 18px; font-weight: 800; line-height: 1;
}
.rs .rs-tl--pink .rs-tl__dot { background: var(--rs-pink); }
.rs .rs-tl--yellow .rs-tl__dot { background: var(--rs-yellow); }
.rs .rs-tl--pink .rs-tl__step:not(:last-child)::before { background: #ffc6da; }
.rs .rs-tl__time { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; color: var(--rs-blue); font-weight: 800; font-size: 17px; line-height: 1.5; letter-spacing: .03em; }
.rs .rs-tl__or { font-size: 15px; font-weight: 700; color: var(--rs-en); }
.rs .rs-tl__name { margin-top: 2px; font-size: 18px; line-height: 1.45; }
.rs .rs-tl__text { margin-top: 2px; }

/* ---------------------------------------------------------------- notice lines (🔺 -> cyan dot, 1️⃣ -> numbered circle, sub lines indented) */
.rs .rs-lines { display: grid; gap: 10px; }
.rs .rs-line { position: relative; min-width: 0; padding-left: 26px; }
.rs .rs-line > [data-rv-marker] { position: absolute; left: 0; top: 0; }
.rs .rs-line__dot { width: 18px; height: 1.75em; }
.rs .rs-line__dot::before { content: ""; position: absolute; left: 4px; top: calc(.875em - 4px); width: 8px; height: 8px; border-radius: 50%; background: var(--rs-cyan); }
.rs .rs-line--num { padding-left: 34px; }
.rs .rs-line__num { display: grid; place-items: center; width: 24px; height: 24px; margin-top: calc((1.75em - 24px) / 2); border-radius: 50%; background: var(--rs-ink); }
.rs .rs-line__num::before { content: attr(data-n); color: #fff; font-size: 15px; font-weight: 800; line-height: 1; }
.rs .rs-line--lead { padding-left: 0; color: var(--rs-ink); font-weight: 700; }
.rs .rs-line--sub { margin-left: 34px; padding: 6px 12px; border-radius: 10px; background: var(--rs-band); }
.rs .rs-line--sub + .rs-line--sub { margin-top: -6px; }
.rs .rs-notice__body { margin-top: 12px; }
.rs .rs-acc__sum .rs-acc__h { display: flex; align-items: center; gap: 12px; font-size: 18px; line-height: 1.5; color: inherit; }

@media (min-width: 600px) {
  .rs .rs-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 32px; }
}
@media (min-width: 768px) {
  .rs .rs-feats { gap: 28px 40px; }
  .rs .rs-feats--tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rs .rs-feat__title { font-size: 19px; }
  .rs .rs-course__img { width: 132px; }
  .rs .rs-tl__dot { width: 46px; height: 46px; font-size: 19px; }
  .rs .rs-tl__step { padding-left: 64px; }
  .rs .rs-tl__step:not(:last-child)::before { left: 22px; top: 44px; }
}
@media (min-width: 1024px) {
  .rs .rs-feats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 36px; }
  .rs .rs-feats--tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .rs .rs-price { font-size: 30px; }
  .rs .rs-table .rs-price { font-size: 24px; }
  .rs .rs-table th, .rs .rs-table td { padding: 14px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .rs .rs-more__sum .rs-ico { transition: none !important; }
}