.runes-page .r-hero { background: #241b25; }
.r-hero-texture { position: absolute; z-index: -3; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: .17; filter: saturate(.65); }
.runes-page .r-hero::before { background: linear-gradient(95deg, #241b25f2, #241b25b8 50%, #35253280); }
.runes-page .n-hero h1 { font-size: clamp(56px, 5.4vw, 80px); }
.runes-page .n-hero-description { max-width: 445px; }
.r-first-note { color: #ae99a7; font-size: 10px; margin: 17px 0 0; }
.r-universe .n-chart-topline { gap: 13px; }
.r-universe .n-chart-topline i { width: 30px; }
.r-stone-scene { position: relative; isolation: isolate; padding-top: 38px; margin: 0 auto; max-width: 570px; }
.r-stone-scene::before { content: ""; position: absolute; z-index: -1; inset: 5% -5% 9%; border-radius: 50%; background: radial-gradient(ellipse at 50% 70%, #b0856b17, #8e597f0d 45%, transparent 70%); }
.r-stone-orbit { position: absolute; z-index: -1; inset: 11% 0 17%; border: 1px solid #c6a97526; border-radius: 50%; transform: rotate(-16deg); }
.r-stone-orbit::before { content: ""; position: absolute; inset: 12px -13px; border: 1px solid #c6a97512; border-radius: inherit; }
.r-stones { display: flex; align-items: center; justify-content: center; min-height: 360px; padding: 0 12px; }
.r-stone { --r-angle: 0deg; position: relative; flex: 0 0 39%; max-width: 230px; aspect-ratio: 2 / 3; margin: 0 -2.5%; padding: 0; border: 0; background: none; color: #e5c38b; transform: rotate(var(--r-angle)); transition: transform .55s ease, filter .55s ease; filter: drop-shadow(0 20px 17px #0f091344); -webkit-tap-highlight-color: transparent; }
.r-stone img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; filter: sepia(.19) saturate(.6) brightness(1.08); pointer-events: none; }
.r-stone-glyph { position: absolute; left: 36%; top: 31%; width: 28%; height: 37%; fill: none; stroke: currentColor; stroke-width: 2.7; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 7px #efce8b22); pointer-events: none; }
.r-stone-name { position: absolute; bottom: -9px; left: 0; right: 0; text-align: center; color: #a994a2; font: italic 20px 'Cormorant Garamond', Georgia, serif; }
.r-stone-left { --r-angle: -16deg; translate: 7px 22px; }
.r-stone-middle { --r-angle: 5deg; translate: 0 -18px; z-index: 2; }
.r-stone-right { --r-angle: 17deg; translate: -7px 18px; }
.r-stone:hover, .r-stone[aria-pressed="true"] { transform: rotate(var(--r-angle)) translateY(-10px); color: #f5d79d; filter: drop-shadow(0 25px 20px #0f091355) drop-shadow(0 0 15px #dbad651a); }
.r-stone[aria-pressed="true"] .r-stone-name { color: #dbbc92; }
.r-stone[aria-pressed="true"] .r-stone-glyph { animation: r-symbol-breathe 6s ease-in-out infinite; }
.r-stone:focus-visible { outline-offset: -30px; border-radius: 45%; }
.r-symbol-description { min-height: 87px; text-align: center; padding-top: 32px; }
.r-symbol-kicker { color: #a38a9c; font-size: 8px; letter-spacing: .07em; }
.r-symbol-description p { margin: 13px 0 0; font: 25px/1.25 'Cormorant Garamond', Georgia, serif; color: #d8c2b3; }
.r-symbol-description p > span { color: #d6b278; }
.r-symbol-description i { padding-inline: 6px; color: #9a7a63; }
.r-symbol-description em { color: #bda0b6; }
.r-universe .n-chart-caption { margin-top: 25px; }
.runes-page .n-insight { min-height: 390px; }
.runes-page .n-insight h4 { font-size: 35px; }
.runes-page .n-insight-icon { width: 56px; height: 56px; right: 0; opacity: .4; }
.runes-page .n-insight .n-overline { font-size: 9px; }
.r-start-card { position: relative; isolation: isolate; border-radius: 18px; padding: 33px 36px 30px; color: #e9dce6; background: radial-gradient(ellipse at 100% 0, #7e52663d, transparent 55%), linear-gradient(140deg, #3b2838, #271b2a); box-shadow: 0 20px 55px #3e253529, inset 0 1px #f6e6d638; }
.r-start-card::before { content: ""; position: absolute; z-index: -1; inset: 0; border-radius: inherit; background-image: radial-gradient(circle, #f6dfad .65px, transparent 1px); background-size: 117px 91px; background-position: 30px 10px; opacity: .19; pointer-events: none; }
.r-start-card h3 { color: #f0e5d7; font-size: 36px; font-weight: 400; line-height: 1.08; }
.r-start-description { color: #cfbbcabf; font-size: 11px; line-height: 1.9; margin: 20px 0 26px; }
.r-start-steps { padding: 0; margin: 0; list-style: none; }
.r-start-steps li { display: flex; align-items: baseline; gap: 17px; padding: 17px 0; border-bottom: 1px solid #e6c9df15; }
.r-start-steps li:first-child { padding-top: 0; }
.r-start-steps li:last-child { border-bottom: 0; }
.r-start-steps li > span { color: #cfb17e; font: italic 25px 'Cormorant Garamond', Georgia, serif; }
.r-start-steps strong { font-size: 12px; font-weight: 500; color: #e9ddcf; }
.r-start-steps p { margin: 6px 0 0; font-size: 10px; line-height: 1.7; color: #c5aec0b3; }
.r-materials { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; padding: 12px 0 24px; }
.r-materials > span { display: flex; flex-direction: column; align-items: center; font-size: 9px; color: #cab8c4; }
.r-materials img { width: 53px; height: 70px; object-fit: contain; filter: drop-shadow(0 7px 5px #120c1638); }
.runes-page .r-start-card .btn-primary { height: 53px; border-radius: 7px; background: linear-gradient(110deg, #c5a477, #e6cca2 54%, #c6a475); color: #382730; box-shadow: 0 8px 20px #130e181f; font-size: 12px; border: none; }
.r-start-note { color: #c8b5c5b8; font-size: 9px; text-align: center; line-height: 1.8; margin: 19px 0 0; }
@keyframes r-symbol-breathe { 0%, 100% { filter: drop-shadow(0 0 4px #efce8b14); } 50% { filter: drop-shadow(0 0 10px #efce8b66); } }
@media (max-width: 1100px) {
  .runes-page .n-hero h1 { font-size: 65px; }
  .r-stones { min-height: 310px; }
  .r-stone-scene { padding-top: 24px; }
  .r-symbol-description p { font-size: 22px; }
  .r-symbol-kicker { font-size: 7px; }
  .r-start-card { padding-inline: 27px; }
  .runes-page .n-insight h4 { font-size: 33px; }
  .runes-page .n-insight-icon { display: none; }
}
@media (max-width: 800px) {
  .runes-page .n-hero h1 { font-size: 54px; }
  .r-universe .n-chart-topline { font-size: 14px; gap: 8px; }
  .r-universe .n-chart-topline i { width: 16px; }
  .r-stones { min-height: 270px; }
  .r-stone-scene { padding-top: 20px; }
  .r-stone-name { font-size: 18px; }
  .r-symbol-description p { font-size: 20px; }
  .r-start-card { padding-inline: 22px; }
  .r-start-card h3 { font-size: 31px; }
  .r-start-description { font-size: 10px; }
  .r-start-steps strong { font-size: 11px; }
  .r-start-steps p { font-size: 9px; }
  .runes-page .n-insight h4 { font-size: 30px; }
}
@media (max-width: 600px) {
  .runes-page .n-hero h1 { font-size: clamp(50px, 14vw, 74px); }
  .r-first-note { font-size: 9px; }
  .r-universe { margin-top: 42px; }
  .r-universe .n-chart-topline { font-size: 17px; }
  .r-stones { min-height: 295px; padding: 0; }
  .r-stone { flex-basis: 40%; }
  .r-stone-scene { padding-top: 22px; }
  .r-symbol-description { padding-top: 17px; min-height: 79px; }
  .r-symbol-description p { font-size: 23px; }
  .r-symbol-kicker { font-size: 7px; }
  .r-universe .n-chart-caption { margin-top: 17px; font-size: 7px; }
  .runes-page .n-hero-bottom p { font-size: 8px; }
  .r-start-card { padding: 27px 23px 24px; }
  .r-start-card h3 { font-size: 35px; }
  .r-start-description { font-size: 11px; }
  .r-start-steps strong { font-size: 12px; }
  .r-start-steps p { font-size: 10px; }
  .runes-page .n-insight h4 { font-size: 31px; }
  .runes-page .n-insight { min-height: 350px; }
  .runes-page .n-insight .n-overline { font-size: 8px; }
  .r-start-note { font-size: 9px; }
}
@media (max-width: 360px) {
  .runes-page .n-hero h1 { font-size: 47px; }
  .r-stones { min-height: 255px; }
  .r-symbol-description p { font-size: 21px; }
  .r-universe .n-chart-topline { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .r-stone, .r-stone-glyph { animation: none !important; transition: none; }
}
