/* rising.css: "Abhyudaya means rising", drawn. A crescent moon rides the rising line, waxes to a full disc and
   warms from light blue to coral: the moon becomes the sun. Markup: [data-rising] with .rs-svg inside (see rising.js).
   No rays, no half-disc on a horizon: the disc only ever appears whole and free-floating, with a soft glow.
   Faint stars fill the sky at night and a few flat clouds drift in by day.
   With reduced motion or no JavaScript the final frame shows, still. Only transform, opacity and colour animate. */
[data-rising] {
  --rs-coral: #DC6563;
  --rs-night: #2F5D8C;  /* the site's blues: data blue, cell blue, section background */
  --rs-glow: #CFDDEA;
  --rs-mist: #EAF0F6;
  position: relative;
}
.rs-svg { display: block; width: 100%; height: 100%; overflow: visible; }
.rs-line { fill: none; stroke: var(--rs-coral); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.rs-disc { fill: var(--rs-coral); }
.rs-unlit { fill: #D3DEEA; }  /* the moon's dark side: a soft blue shadow, solid so the line never shows through; the full disc covers it */
.rs-glow { fill: #F2A89C; opacity: 0.45; }  /* the moon's soft halo warms into the sun's; a glow, never rays or spokes */

/* the phrase (real text, outside the SVG) */
.rs-phrase { margin: 0; font: 600 clamp(2rem, 1rem + 4.6vw, 4.5rem)/1 "Inter Tight", var(--display, system-ui), sans-serif; letter-spacing: -0.04em; color: #1C1B1F; }
.rs-phrase em { font-style: normal; color: var(--rs-coral); }

/* the sky: an optional element (data-rising-sky) tinted misty blue at night, fading to the page cream by day */
[data-rising-sky] { position: relative; isolation: isolate; }
[data-rising-sky]::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--rs-mist, #EAF0F6); opacity: 0; pointer-events: none; }

/* the sky layer (added by rising.js, behind the content): faint stars at night, a few flat clouds by day */
.rs-sky { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.rs-star { position: absolute; width: var(--s); height: var(--s); border-radius: 50%; background: #7593B6; opacity: 0; transition: opacity 1400ms ease; }
.rs-star--glint { border-radius: 0; background: #5F80A8; clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%); }
.rs-cloud { position: absolute; display: block; min-width: 56px; opacity: 0.95; }
.rs-cloud svg { display: block; width: 100%; height: auto; fill: #E1E9F2; }
@media (max-width: 760px) { .rs-cloud:nth-of-type(3) { display: none; } }  /* on phones the low cloud would sit behind text */

@media (prefers-reduced-motion: no-preference) {
  /* until rising.js has drawn the first frame, hide the moving parts so the final frame never flashes */
  .mo [data-rising]:not(.is-armed):not(.is-done) :is(.rs-moon, .rs-line, .rs-phrase) { opacity: 0; }
  .mo [data-rising].is-armed .rs-phrase { opacity: 0; transform: translateY(14px); }
  .mo [data-rising] .rs-phrase { transition: opacity 700ms cubic-bezier(0.23, 1, 0.32, 1), transform 700ms cubic-bezier(0.23, 1, 0.32, 1); }
  .mo [data-rising].is-text .rs-phrase { opacity: 1; transform: none; }
  .mo [data-rising-sky].is-night::before { opacity: 1; transition: none; }  /* night is instant; only the move to day fades */
  .mo [data-rising-sky]::before { transition: opacity 2600ms cubic-bezier(0.65, 0, 0.35, 1); }
  .mo [data-rising-sky]:not(.is-day) .rs-star { opacity: var(--o); }  /* the stars stay until the sun starts to warm, then fade */
  .mo [data-rising-sky]:not(.is-day) .rs-cloud { opacity: 0; transform: translateX(-28px); }
  .mo .rs-cloud { transition: opacity 1600ms ease var(--d), transform 3200ms cubic-bezier(0.23, 1, 0.32, 1) var(--d); }
}