:root {
    --riry-bg: #f5f7f5;
    --riry-paper: #fbfcfa;
    --riry-ink: #0a1730;
    --riry-navy: #0a2d70;
    --riry-blue: #128edf;
    --riry-aqua: #15b9ad;
    --riry-muted: rgba(10, 23, 48, .56);
    --riry-hairline: rgba(10, 45, 112, .12);
    --mx: 62%;
    --my: 32%;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--riry-bg); }

body.riry-coming-soon {
    margin: 0;
    min-width: 320px;
    min-height: 100%;
    overflow-x: hidden;
    color: var(--riry-ink);
    background: var(--riry-bg);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.riry-stage {
    position: relative;
    isolation: isolate;
    min-height: 100svh;
    overflow-x: hidden;
    overflow-y: auto;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    padding: clamp(22px, 2.8vw, 44px) clamp(20px, 4vw, 64px) clamp(20px, 2.5vw, 38px);
    background:
        radial-gradient(circle at var(--mx) var(--my), rgba(21,185,173,.07), transparent 26%),
        linear-gradient(135deg, #fcfdfb 0%, #f4f7f5 48%, #edf4f5 100%);
}

body.admin-bar .riry-stage { min-height: calc(100svh - 32px); }

.riry-stage::before {
    content: "";
    position: absolute;
    z-index: -5;
    inset: 0;
    background:
        linear-gradient(90deg, transparent 0 7%, rgba(10,45,112,.035) 7% 7.06%, transparent 7.06% 93%, rgba(10,45,112,.035) 93% 93.06%, transparent 93.06%),
        linear-gradient(180deg, transparent 0 12%, rgba(10,45,112,.025) 12% 12.08%, transparent 12.08% 88%, rgba(10,45,112,.025) 88% 88.08%, transparent 88.08%);
    pointer-events: none;
}

.riry-film {
    position: absolute;
    z-index: -4;
    pointer-events: none;
    filter: blur(18px);
    will-change: transform;
}

.riry-film--aqua {
    width: min(48vw, 760px);
    height: min(34vw, 520px);
    left: -14vw;
    bottom: -17vw;
    border-radius: 38% 62% 71% 29% / 48% 38% 62% 52%;
    background: linear-gradient(135deg, rgba(21,185,173,.18), rgba(18,142,223,.06) 58%, transparent 76%);
    animation: riry-film-aqua 12s ease-in-out infinite alternate;
}

.riry-film--blue {
    width: min(42vw, 680px);
    height: min(28vw, 440px);
    right: -12vw;
    bottom: -8vw;
    border-radius: 63% 37% 44% 56% / 52% 67% 33% 48%;
    background: linear-gradient(145deg, transparent 10%, rgba(18,142,223,.12), rgba(21,185,173,.08));
    animation: riry-film-blue 15s ease-in-out infinite alternate;
}

.riry-film--navy {
    width: min(34vw, 520px);
    height: min(22vw, 340px);
    right: -10vw;
    top: -10vw;
    border-radius: 33% 67% 54% 46% / 48% 45% 55% 52%;
    background: linear-gradient(155deg, rgba(10,45,112,.11), rgba(18,142,223,.025) 65%, transparent);
    animation: riry-film-navy 17s ease-in-out infinite alternate;
}

.riry-specular {
    position: absolute;
    z-index: -3;
    inset: -40% -20%;
    width: 32%;
    transform: translateX(-160%) rotate(16deg);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.76), rgba(21,185,173,.035), transparent);
    filter: blur(14px);
    opacity: .66;
    pointer-events: none;
    animation: riry-surface-wash 9s cubic-bezier(.45,0,.2,1) 2.2s infinite;
}

.riry-grain {
    position: absolute;
    z-index: 20;
    inset: 0;
    opacity: .16;
    pointer-events: none;
    mix-blend-mode: multiply;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
}

.riry-topbar,
.riry-footer {
    position: relative;
    z-index: 10;
    display: grid;
    align-items: center;
    font-size: 9px;
    font-weight: 720;
    line-height: 1;
    letter-spacing: .23em;
    text-transform: uppercase;
    color: rgba(10,23,48,.52);
}

.riry-topbar {
    grid-template-columns: 1fr 1fr;
}

.riry-brandmark,
.riry-domain,
.riry-footer {
    opacity: 0;
    animation: riry-meta-in .8s ease 1.3s forwards;
}

.riry-brandmark span { color: var(--riry-aqua); }

.riry-domain {
    justify-self: end;
    color: var(--riry-ink);
    text-decoration: none;
    transition: color .25s ease;
}

.riry-domain:hover,
.riry-domain:focus-visible,
.riry-credit a:hover,
.riry-credit a:focus-visible { color: var(--riry-aqua); }

.riry-main {
    position: relative;
    z-index: 5;
    min-height: 0;
    display: grid;
    place-items: center;
    padding: clamp(30px, 5vh, 70px) 0;
}

.riry-hero {
    width: min(980px, 100%);
    text-align: center;
}

.riry-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: clamp(18px, 2.2vh, 28px);
    color: rgba(10,23,48,.56);
    font-size: 8px;
    font-weight: 760;
    letter-spacing: .25em;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(8px);
    animation: riry-rise-in .75s cubic-bezier(.2,.75,.2,1) .52s forwards;
}

.riry-eyebrow__dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--riry-aqua);
    box-shadow: 0 0 0 5px rgba(21,185,173,.08);
    animation: riry-dot-breathe 3.6s ease-in-out 2s infinite;
}

.riry-panel {
    position: relative;
    width: min(860px, 100%);
    margin-inline: auto;
    padding: clamp(30px, 4.6vw, 56px) clamp(22px, 5vw, 66px) clamp(30px, 4.2vw, 50px);
    border: 1px solid rgba(255,255,255,.8);
    border-radius: clamp(28px, 3.2vw, 46px);
    background:
        linear-gradient(145deg, rgba(255,255,255,.72), rgba(248,251,249,.5)),
        rgba(255,255,255,.46);
    box-shadow:
        0 32px 90px rgba(10,45,112,.065),
        inset 0 1px 0 rgba(255,255,255,.92),
        inset 0 -1px 0 rgba(10,45,112,.035);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    opacity: 0;
    transform: translateY(16px) scale(.992);
    animation: riry-panel-in 1s cubic-bezier(.16,.75,.2,1) .25s forwards;
}

.riry-panel::before,
.riry-panel::after {
    content: "";
    position: absolute;
    pointer-events: none;
    border-radius: inherit;
}

.riry-panel::before {
    inset: 8px;
    border: 1px solid rgba(10,45,112,.055);
}

.riry-panel::after {
    inset: 0;
    background: radial-gradient(circle at var(--mx) var(--my), rgba(21,185,173,.045), transparent 28%);
    opacity: .85;
}

.riry-panel__layer {
    position: absolute;
    z-index: -1;
    pointer-events: none;
    border-radius: 44px;
    opacity: 0;
}

.riry-panel__layer--one {
    inset: 7% 10% auto -3%;
    height: 56%;
    background: linear-gradient(135deg, rgba(21,185,173,.12), transparent 70%);
    filter: blur(30px);
    transform: translateX(-32px) rotate(-3deg);
    animation: riry-layer-one 1.35s cubic-bezier(.2,.75,.2,1) .7s forwards;
}

.riry-panel__layer--two {
    inset: auto -2% 3% 27%;
    height: 48%;
    background: linear-gradient(135deg, transparent, rgba(18,142,223,.10));
    filter: blur(34px);
    transform: translateX(34px) rotate(2deg);
    animation: riry-layer-two 1.35s cubic-bezier(.2,.75,.2,1) .82s forwards;
}

.riry-panel__shine {
    position: absolute;
    z-index: 4;
    inset: 1px;
    border-radius: inherit;
    overflow: hidden;
    pointer-events: none;
}

.riry-panel__shine::before {
    content: "";
    position: absolute;
    top: -35%;
    bottom: -35%;
    left: -32%;
    width: 14%;
    transform: skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.62), rgba(255,255,255,.15), transparent);
    filter: blur(5px);
    opacity: 0;
    animation: riry-panel-sheen 1.45s ease 1.12s forwards;
}

.riry-logo-wrap {
    position: relative;
    z-index: 5;
    width: min(610px, 78vw);
    margin-inline: auto;
    opacity: 0;
    transform: translateY(12px) scale(.985);
    animation: riry-logo-in 1s cubic-bezier(.16,.75,.2,1) .65s forwards;
}

.riry-logo {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    user-select: none;
    -webkit-user-drag: none;
    filter: drop-shadow(0 18px 30px rgba(10,45,112,.075));
}

.riry-copy {
    position: relative;
    z-index: 5;
    margin-top: clamp(20px, 3vh, 32px);
}

.riry-kicker {
    margin-bottom: 11px;
    color: var(--riry-muted);
    font-size: 8px;
    font-weight: 760;
    letter-spacing: .29em;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(8px);
    animation: riry-rise-in .7s cubic-bezier(.2,.75,.2,1) 1.25s forwards;
}

.riry-kicker span { color: var(--riry-aqua); }

.riry-copy h1 {
    margin: 0;
    color: var(--riry-ink);
    font-size: clamp(40px, 5.2vw, 72px);
    font-weight: 560;
    line-height: .91;
    letter-spacing: -.055em;
}

.riry-copy h1 span {
    display: block;
    opacity: 0;
    transform: translateY(18px);
    animation: riry-title-in .85s cubic-bezier(.16,.75,.2,1) forwards;
}

.riry-copy h1 span:first-child { animation-delay: 1.38s; }
.riry-copy h1 span:last-child {
    color: var(--riry-navy);
    animation-delay: 1.48s;
}

.riry-copy p {
    max-width: 590px;
    margin: 18px auto 0;
    color: var(--riry-muted);
    font-size: clamp(12px, 1vw, 14px);
    font-weight: 430;
    line-height: 1.72;
    letter-spacing: .012em;
    opacity: 0;
    transform: translateY(10px);
    animation: riry-rise-in .8s cubic-bezier(.2,.75,.2,1) 1.7s forwards;
}

.riry-finish-rail {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: clamp(18px, 2.8vh, 30px);
    color: rgba(10,23,48,.4);
    font-size: 7px;
    font-weight: 760;
    letter-spacing: .22em;
    text-transform: uppercase;
    opacity: 0;
    animation: riry-meta-in .75s ease 1.9s forwards;
}

.riry-swatch {
    width: 34px;
    height: 7px;
    border-radius: 999px;
    box-shadow: inset 0 1px 1px rgba(255,255,255,.38);
    transform-origin: center;
    animation: riry-swatch-breathe 5s ease-in-out infinite;
}

.riry-swatch--navy { background: linear-gradient(90deg, #071e4e, var(--riry-navy)); animation-delay: 2.2s; }
.riry-swatch--blue { background: linear-gradient(90deg, var(--riry-navy), var(--riry-blue)); animation-delay: 2.5s; }
.riry-swatch--aqua { background: linear-gradient(90deg, var(--riry-blue), var(--riry-aqua)); animation-delay: 2.8s; }

.riry-footer {
    grid-template-columns: 1fr auto 1fr;
}
.riry-footer > :first-child { justify-self: start; }
.riry-footer > :last-child { justify-self: end; }
.riry-credit { justify-self: center; }
.riry-credit a {
    color: var(--riry-ink);
    text-decoration: none;
    transition: color .25s ease;
}

@keyframes riry-panel-in { to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes riry-logo-in { to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes riry-title-in { to { opacity: 1; transform: translateY(0); } }
@keyframes riry-rise-in { to { opacity: 1; transform: translateY(0); } }
@keyframes riry-meta-in { to { opacity: 1; } }
@keyframes riry-layer-one { to { opacity: .9; transform: translateX(0) rotate(-1deg); } }
@keyframes riry-layer-two { to { opacity: .9; transform: translateX(0) rotate(1deg); } }
@keyframes riry-panel-sheen {
    0% { left: -32%; opacity: 0; }
    18% { opacity: .7; }
    100% { left: 120%; opacity: 0; }
}
@keyframes riry-dot-breathe {
    0%,100% { box-shadow: 0 0 0 5px rgba(21,185,173,.07); }
    50% { box-shadow: 0 0 0 8px rgba(21,185,173,.025); }
}
@keyframes riry-swatch-breathe {
    0%,100% { transform: scaleX(1); filter: saturate(.92); }
    50% { transform: scaleX(1.045); filter: saturate(1.08); }
}
@keyframes riry-film-aqua {
    from { transform: translate3d(-2%, 3%, 0) rotate(-3deg) scale(.98); }
    to { transform: translate3d(6%, -3%, 0) rotate(2deg) scale(1.04); }
}
@keyframes riry-film-blue {
    from { transform: translate3d(4%, 3%, 0) rotate(2deg) scale(1); }
    to { transform: translate3d(-5%, -4%, 0) rotate(-3deg) scale(1.05); }
}
@keyframes riry-film-navy {
    from { transform: translate3d(2%, -2%, 0) rotate(-1deg); }
    to { transform: translate3d(-6%, 5%, 0) rotate(3deg); }
}
@keyframes riry-surface-wash {
    0%, 18% { transform: translateX(-170%) rotate(16deg); opacity: 0; }
    28% { opacity: .58; }
    54% { transform: translateX(380%) rotate(16deg); opacity: .28; }
    55%,100% { transform: translateX(380%) rotate(16deg); opacity: 0; }
}

@media (max-width: 820px) {
    .riry-stage { padding: 22px 22px 20px; }
    .riry-main { padding: 34px 0; }
    .riry-panel { width: min(720px, 100%); }
    .riry-logo-wrap { width: min(560px, 82vw); }
    .riry-copy h1 { font-size: clamp(38px, 8.4vw, 60px); }
}

@media (max-width: 620px) {
    body.admin-bar .riry-stage { min-height: calc(100svh - 46px); }

    .riry-stage {
        grid-template-rows: auto auto auto;
        min-height: 100svh;
        padding: max(18px, env(safe-area-inset-top)) 16px max(18px, env(safe-area-inset-bottom));
    }

    .riry-topbar,
    .riry-footer {
        font-size: 7px;
        letter-spacing: .16em;
    }

    .riry-brandmark { max-width: 58vw; line-height: 1.4; }

    .riry-main {
        min-height: auto;
        padding: clamp(34px, 7vh, 58px) 0;
    }

    .riry-eyebrow {
        margin-bottom: 16px;
        font-size: 7px;
        letter-spacing: .19em;
    }

    .riry-panel {
        width: 100%;
        padding: 30px 18px 28px;
        border-radius: 28px;
        backdrop-filter: blur(5px);
        -webkit-backdrop-filter: blur(5px);
    }

    .riry-panel::before { inset: 6px; }

    .riry-logo-wrap {
        width: min(100%, 440px);
        max-width: 100%;
    }

    .riry-copy { margin-top: 22px; }
    .riry-kicker { font-size: 7px; letter-spacing: .23em; }

    .riry-copy h1 {
        font-size: clamp(36px, 11.6vw, 50px);
        line-height: .94;
        letter-spacing: -.05em;
    }

    .riry-copy p {
        max-width: 330px;
        margin-top: 16px;
        font-size: 12px;
        line-height: 1.65;
    }

    .riry-desktop-break { display: none; }

    .riry-finish-rail {
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 18px;
    }

    .riry-finish-rail__label--end { width: 100%; }
    .riry-swatch { width: 27px; height: 6px; }

    .riry-footer {
        grid-template-columns: 1fr 1fr;
        row-gap: 10px;
        line-height: 1.35;
    }

    .riry-credit {
        grid-column: 1 / -1;
        grid-row: 1;
        justify-self: start;
    }

    .riry-footer > :first-child { grid-column: 1; grid-row: 2; }
    .riry-footer > :last-child { grid-column: 2; grid-row: 2; text-align: right; }

    .riry-film--aqua { width: 92vw; height: 58vw; left: -48vw; bottom: -22vw; }
    .riry-film--blue { width: 80vw; height: 48vw; right: -44vw; bottom: 4vw; }
    .riry-film--navy { width: 72vw; height: 40vw; right: -42vw; top: 5vw; }
}

@media (max-width: 390px) {
    .riry-stage { padding-left: 13px; padding-right: 13px; }
    .riry-panel { padding-left: 14px; padding-right: 14px; }
    .riry-copy h1 { font-size: clamp(34px, 11.5vw, 44px); }
    .riry-domain { font-size: 6.5px; }
}

@media (max-height: 720px) and (min-width: 621px) {
    .riry-stage { padding-top: 18px; padding-bottom: 18px; }
    .riry-main { padding: 20px 0; }
    .riry-eyebrow { margin-bottom: 12px; }
    .riry-panel { padding-top: 24px; padding-bottom: 24px; }
    .riry-logo-wrap { width: min(500px, 64vw); }
    .riry-copy { margin-top: 12px; }
    .riry-copy h1 { font-size: clamp(34px, 4.4vw, 56px); }
    .riry-copy p { margin-top: 10px; }
    .riry-finish-rail { margin-top: 14px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .001ms !important;
        animation-delay: 0ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}
