:root {
    --rn-ink: #001634;
    --rn-ink-deep: #001634;
    --rn-ink-2: #172A47;
    --rn-aqua: #57D6C3;
    --rn-aqua-master: #ACE5E2;
    --rn-aqua-soft: #DFF8F3;
    --rn-blue: #0166FF;
    --rn-blue-bright: #0166FF;
    --rn-ice: #F5F8FA;
    --rn-white: #FFFFFF;
    --rn-text: #182333;
    --rn-muted: #68788C;
    --rn-line: #DDE5EB;
    --rn-font: "Nexa", "Nexa Book", "Avenir Next", Montserrat, Arial, sans-serif;
    --rn-font-ui: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    --rn-font-heavy: "Nexa Bold", "Nexa Heavy", "Nexa", "Avenir Next", Montserrat, Arial, sans-serif;
    --rn-font-headline: "Nexa", "Nexa Book", "Avenir Next", Montserrat, Arial, sans-serif;
    --rn-container: 1180px;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--rn-ice); }
body {
    margin: 0;
    min-width: 320px;
    background: var(--rn-ice);
    color: var(--rn-text);
    font-family: var(--rn-font);
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; }
a { color: inherit; }

.rn-site-shell { min-height: 100vh; display: flex; flex-direction: column; }
.rn-container { width: min(calc(100% - 48px), var(--rn-container)); margin-inline: auto; }

.rn-skip-link {
    position: fixed;
    z-index: 9999;
    top: 12px;
    left: 12px;
    transform: translateY(-160%);
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--rn-white);
    color: var(--rn-ink);
    font-family: var(--rn-font-heavy);
    text-decoration: none;
}
.rn-skip-link:focus { transform: translateY(0); outline: 3px solid rgba(172, 229, 226, 0.85); outline-offset: 3px; }

/* Header floats over the dark hero. WEB-01.1G turns the previously reserved
 * right-hand slot into the single public handoff to the workspace gateway. */
.rn-site-header {
    position: relative;
    z-index: 20;
    padding: 24px 0;
}
.rn-site-header--overlay {
    position: absolute;
    inset: 0 0 auto;
    color: var(--rn-white);
}
.rn-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 42px; }
.rn-brand, .rn-footer-brand { display: inline-flex; align-items: center; text-decoration: none; }
.rn-brand--inverse { width: 196px; max-width: 42vw; }
.rn-brand-inverse-master {
    display: block;
    width: 100%;
    aspect-ratio: 11302.69 / 1711.74;
    /* Exact Logo_Rainnum.svg silhouette. The master itself is used as the mask;
       only the presentation colours change for the dark hero. */
    background: linear-gradient(90deg, var(--rn-aqua-master) 0 11.2%, var(--rn-white) 11.2% 100%);
    -webkit-mask: url("../images/Logo_Rainnum.svg") center / contain no-repeat;
    mask: url("../images/Logo_Rainnum.svg") center / contain no-repeat;
}
.rn-brand:focus-visible, .rn-footer-brand:focus-visible, .rn-text-link:focus-visible {
    outline: 3px solid rgba(172, 229, 226, 0.75);
    outline-offset: 6px;
    border-radius: 7px;
}
.rn-header-access {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    min-width: 104px;
    min-height: 40px;
    padding: 9px 17px 8px;
    border: 1px solid rgba(172, 229, 226, 0.72);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.035);
    color: var(--rn-white);
    font: 750 13px/1 var(--rn-font-ui);
    letter-spacing: -0.01em;
    text-decoration: none;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
.rn-header-access:hover {
    border-color: var(--rn-aqua-master);
    background: var(--rn-aqua-master);
    color: var(--rn-ink);
    transform: translateY(-1px);
}
.rn-header-access:focus-visible {
    outline: 3px solid rgba(172, 229, 226, 0.78);
    outline-offset: 4px;
}
.rn-header-access:active { transform: translateY(0); }

.rn-main { flex: 1; }
.rn-main--landing { display: block; }
.rn-hero--dramatic {
    position: relative;
    isolation: isolate;
    min-height: clamp(900px, 100svh, 1160px);
    overflow: hidden;
    display: grid;
    place-items: start center;
    padding: clamp(210px, 25vh, 325px) 0 220px;
    /* 01.1A.4: one continuous atmospheric descent. The dark storm remains
       behind the message, reaches the exact Rainnum electric blue without a
       flat band, then opens gradually through clear-sky blues into the same
       #F5F8FA canvas used by the rest of the public site. */
    background: linear-gradient(
        180deg,
        #001634 0%,
        #001634 40%,
        #001C46 45%,
        #00265C 49%,
        #003474 53%,
        #004493 57%,
        #0054B9 61%,
        #0166FF 66%,
        #1677FF 71%,
        #3389FF 76%,
        #559DFF 81%,
        #7DB4FC 86%,
        #A6CCF5 91%,
        #C9DFF1 95%,
        #E3EEF5 98%,
        #F5F8FA 100%
    );
}
.rn-hero-atmosphere { display: none; }
.rn-hero-center { position: relative; z-index: 2; text-align: center; }
.rn-hero-kicker {
    margin: 0 0 10px;
    color: #0166FF;
    font-family: var(--rn-font-ui);
    font-size: clamp(24px, 3vw, 40px);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -0.025em;
}
.rn-hero--dramatic h1 {
    max-width: 980px;
    margin: 0 auto;
    color: var(--rn-white);
    font-family: var(--rn-font-headline);
    font-size: clamp(54px, 6vw, 80px);
    font-weight: 500;
    line-height: 1.04;
    letter-spacing: -0.035em;
    text-wrap: balance;
    text-shadow: 0 6px 30px rgba(0, 22, 52, 0.14);
}
.rn-hero-fade { display: none; }

.rn-site-footer { padding: 26px 0 34px; background: var(--rn-white); }
.rn-site-footer--landing { padding-top: clamp(110px, 14vh, 185px); background: var(--rn-ice); }
.rn-footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 25px; border-top: 1px solid rgba(12, 28, 51, 0.08); }
.rn-footer-brand img { width: 154px; display: block; }
.rn-footer-inner p { margin: 0; color: var(--rn-muted); font-size: 12px; }
.rn-footer-inner p span { margin-left: 5px; }

/* Generic WordPress fallbacks remain readable while the public homepage is
 * controlled by front-page.php. */
.rn-generic-main { padding: 120px 0 100px; background: var(--rn-ice); }
.rn-generic-card { max-width: 860px; padding: clamp(26px, 5vw, 52px); border: 1px solid var(--rn-line); border-radius: 24px; background: var(--rn-white); box-shadow: 0 16px 50px rgba(12, 28, 51, 0.07); }
.rn-generic-card h1 { margin-top: 0; color: var(--rn-ink); font-family: var(--rn-font-heavy); font-size: clamp(34px, 5vw, 58px); line-height: 1.08; letter-spacing: -0.035em; }
.rn-entry-content { color: #455970; }
.rn-entry-content > *:first-child { margin-top: 0; }
.rn-entry-content > *:last-child { margin-bottom: 0; }
.rn-404-card p { color: var(--rn-muted); }
.rn-text-link { display: inline-block; margin-top: 14px; color: var(--rn-ink); font-family: var(--rn-font-heavy); font-weight: 800; text-underline-offset: 4px; }

@media (max-width: 980px) {
    .rn-hero--dramatic {
        min-height: clamp(700px, 80vh, 860px);
        padding-top: clamp(200px, 24vh, 270px);
    }
    .rn-hero--dramatic h1 { max-width: 800px; }
}

@media (max-width: 680px) {
    .rn-container { width: min(calc(100% - 32px), var(--rn-container)); }
    .rn-site-header { padding: 19px 0; }
    .rn-header-inner { min-height: 34px; }
    .rn-brand--inverse { width: 164px; max-width: 52vw; }
    .rn-header-access {
        min-width: 92px;
        min-height: 36px;
        padding: 8px 14px 7px;
        font-size: 12px;
    }
    .rn-hero--dramatic {
        min-height: clamp(760px, 100svh, 940px);
        padding: clamp(175px, 23svh, 230px) 0 150px;
        background: linear-gradient(
            180deg,
            #001634 0%,
            #001634 42%,
            #001C46 47%,
            #00265C 51%,
            #003474 55%,
            #004493 59%,
            #0054B9 63%,
            #0166FF 68%,
            #1677FF 73%,
            #3389FF 78%,
            #559DFF 83%,
            #7DB4FC 88%,
            #A6CCF5 92%,
            #C9DFF1 96%,
            #E3EEF5 98.5%,
            #F5F8FA 100%
        );
    }
    .rn-hero-kicker { margin-bottom: 10px; font-size: clamp(20px, 6.2vw, 28px); }
    .rn-hero--dramatic h1 {
        max-width: 560px;
        font-size: clamp(43px, 12.4vw, 61px);
        font-weight: 500;
        line-height: 1.055;
        letter-spacing: -0.035em;
    }
    .rn-site-footer--landing { padding-top: 88px; }
    .rn-footer-inner { align-items: flex-start; flex-direction: column; gap: 14px; }
    .rn-footer-inner p span { display: block; margin: 1px 0 0; }
}

@media (max-width: 390px) {
    .rn-container { width: min(calc(100% - 26px), var(--rn-container)); }
    .rn-brand--inverse { width: 150px; }
    .rn-hero--dramatic { padding-top: 168px; }
    .rn-hero-kicker { font-size: 18px; }
    .rn-hero--dramatic h1 { font-size: 41px; }
}

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

/* --------------------------------------------------------------------------
 * RAINNUM-WEB-01.1B — Hero continuation / core product story
 * Everything below begins after the physically approved 01.1A.4 hero.
 * -------------------------------------------------------------------------- */
.rn-visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.rn-story-section {
    position: relative;
    background: var(--rn-ice);
}

.rn-story-intro {
    padding: clamp(135px, 18vw, 235px) 0 clamp(120px, 15vw, 190px);
}

.rn-story-intro-inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 820px) minmax(120px, 1fr);
    gap: clamp(54px, 8vw, 118px);
    align-items: end;
}

.rn-story-copy { max-width: 820px; }

.rn-story-eyebrow {
    margin: 0 0 24px;
    color: var(--rn-blue);
    font-family: var(--rn-font-ui);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.16em;
}

.rn-story-copy h2,
.rn-section-heading h2 {
    margin: 0;
    color: var(--rn-ink);
    font-family: var(--rn-font-headline);
    font-weight: 500;
    letter-spacing: -0.045em;
    text-wrap: balance;
}

.rn-story-copy h2 {
    max-width: 800px;
    font-size: clamp(46px, 5.2vw, 70px);
    line-height: 0.98;
}

.rn-story-copy h2 span {
    display: block;
    color: var(--rn-blue);
}

.rn-story-lead {
    max-width: 680px;
    margin: 40px 0 0;
    color: #506179;
    font-family: var(--rn-font-ui);
    font-size: clamp(19px, 1.7vw, 24px);
    font-weight: 400;
    line-height: 1.55;
}

.rn-story-jump {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-top: 34px;
    color: var(--rn-ink);
    font-family: var(--rn-font-ui);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.rn-story-jump span {
    color: var(--rn-blue);
    font-size: 19px;
    line-height: 1;
}

.rn-story-jump:hover { color: var(--rn-blue); }
.rn-story-jump:focus-visible {
    outline: 3px solid rgba(1, 102, 255, 0.24);
    outline-offset: 7px;
    border-radius: 4px;
}

.rn-story-signature {
    position: relative;
    min-height: 280px;
    align-self: stretch;
}

.rn-story-signature-line {
    position: absolute;
    top: 0;
    bottom: 34px;
    left: 50%;
    width: 1px;
    background: linear-gradient(180deg, rgba(1, 102, 255, 0), rgba(1, 102, 255, 0.28) 32%, rgba(87, 214, 195, 0.72));
}

.rn-story-signature-drop {
    position: absolute;
    bottom: 4px;
    left: calc(50% - 9px);
    width: 18px;
    height: 18px;
    border-radius: 58% 42% 66% 34% / 62% 44% 56% 38%;
    background: var(--rn-aqua);
    transform: rotate(38deg);
    box-shadow: 0 12px 30px rgba(87, 214, 195, 0.22);
}

.rn-section-heading { max-width: 820px; }
.rn-section-heading h2 {
    font-size: clamp(38px, 4.2vw, 58px);
    line-height: 1.02;
}
.rn-section-heading > p:last-child:not(.rn-story-eyebrow) {
    max-width: 690px;
    margin: 28px 0 0;
    color: #586981;
    font-family: var(--rn-font-ui);
    font-size: clamp(18px, 1.55vw, 22px);
    line-height: 1.55;
}

/* One current, not five SaaS cards. */
.rn-journey {
    padding: clamp(95px, 11vw, 150px) 0 clamp(150px, 16vw, 220px);
}

.rn-section-heading--journey { margin-bottom: clamp(76px, 9vw, 118px); }

.rn-journey-list {
    position: relative;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rn-journey-list::before {
    content: "";
    position: absolute;
    top: 27px;
    left: 5.5%;
    right: 5.5%;
    height: 1px;
    background: linear-gradient(90deg, rgba(1, 102, 255, 0.12), rgba(1, 102, 255, 0.54) 50%, rgba(87, 214, 195, 0.48));
}

.rn-journey-step {
    position: relative;
    min-width: 0;
    padding-right: clamp(20px, 3vw, 46px);
}

.rn-journey-step:last-child { padding-right: 0; }

.rn-journey-marker {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    margin-bottom: 28px;
    border: 1px solid rgba(1, 102, 255, 0.16);
    border-radius: 60% 40% 62% 38% / 64% 43% 57% 36%;
    background: var(--rn-ice);
    color: var(--rn-blue);
    box-shadow: 0 0 0 8px var(--rn-ice);
    transform: rotate(38deg);
}

.rn-journey-marker span {
    display: block;
    font-family: var(--rn-font-ui);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    transform: rotate(-38deg);
}

.rn-journey-step--fiscal .rn-journey-marker {
    border-color: var(--rn-blue);
    background: var(--rn-blue);
    color: var(--rn-white);
    box-shadow: 0 0 0 8px var(--rn-ice), 0 14px 34px rgba(1, 102, 255, 0.13);
}
.rn-journey-step--fiscal h3 { color: var(--rn-blue); }
.rn-journey-step:last-child .rn-journey-marker {
    border-color: rgba(87, 214, 195, 0.42);
    color: #168C80;
}

.rn-journey-step h3 {
    margin: 0;
    color: var(--rn-ink);
    font-family: var(--rn-font-headline);
    font-size: clamp(21px, 1.7vw, 27px);
    font-weight: 500;
    line-height: 1.05;
    letter-spacing: -0.035em;
}

.rn-journey-step p {
    max-width: 175px;
    margin: 12px 0 0;
    color: #65758A;
    font-family: var(--rn-font-ui);
    font-size: 14px;
    line-height: 1.45;
}

/* Product proof — synthetic, bounded and deliberately not a browser mockup. */
.rn-product-proof {
    padding: clamp(100px, 12vw, 165px) 0 clamp(145px, 17vw, 230px);
}

.rn-section-heading--product { margin-bottom: clamp(64px, 8vw, 104px); }

.rn-product-stage {
    position: relative;
    isolation: isolate;
    padding: clamp(22px, 4vw, 56px);
}

.rn-product-orbit {
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    filter: blur(64px);
    opacity: 0.72;
    transform: translateZ(0);
}
.rn-product-orbit--one {
    width: min(44vw, 520px);
    aspect-ratio: 1;
    right: -2%;
    top: -4%;
    background: rgba(87, 214, 195, 0.24);
}
.rn-product-orbit--two {
    width: min(40vw, 460px);
    aspect-ratio: 1;
    left: -2%;
    bottom: -4%;
    background: rgba(1, 102, 255, 0.13);
}

.rn-product-window {
    overflow: hidden;
    border: 1px solid rgba(0, 22, 52, 0.07);
    border-radius: clamp(24px, 3vw, 38px);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 42px 100px rgba(0, 22, 52, 0.12), 0 8px 24px rgba(0, 22, 52, 0.05);
}

.rn-product-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 88px;
    padding: 20px clamp(22px, 3vw, 38px);
    border-bottom: 1px solid rgba(0, 22, 52, 0.07);
}

.rn-product-brandline {
    display: flex;
    align-items: center;
    gap: 15px;
}

.rn-product-mark {
    position: relative;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    border-radius: 13px;
    background: var(--rn-aqua-soft);
}
.rn-product-mark::before,
.rn-product-mark::after {
    content: "";
    position: absolute;
    left: 50%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--rn-ink);
    transform: translateX(-50%);
}
.rn-product-mark::before { top: 9px; box-shadow: -10px 5px 0 var(--rn-ink), 10px 5px 0 var(--rn-ink); }
.rn-product-mark::after { bottom: 8px; box-shadow: -9px -2px 0 var(--rn-ink), 9px -2px 0 var(--rn-ink); }

.rn-product-overline,
.rn-ui-label {
    display: block;
    color: #8490A1;
    font-family: var(--rn-font-ui);
    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0.11em;
}

.rn-product-brandline strong {
    display: block;
    margin-top: 3px;
    color: var(--rn-ink);
    font-family: var(--rn-font-ui);
    font-size: 16px;
    line-height: 1.15;
}

.rn-demo-badge,
.rn-ui-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--rn-aqua-soft);
    color: #167F73;
    font-family: var(--rn-font-ui);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.05em;
}
.rn-demo-badge { letter-spacing: 0.1em; }
.rn-ui-chip--quiet { background: #EEF3F7; color: #66768A; }

.rn-product-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.42fr) minmax(310px, 0.72fr);
    min-height: 590px;
}

.rn-product-editor {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: clamp(28px, 4vw, 50px);
}

.rn-product-context,
.rn-product-facts,
.rn-product-next {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.rn-product-context strong,
.rn-product-facts strong,
.rn-product-next strong {
    display: block;
    margin-top: 6px;
    color: var(--rn-ink);
    font-family: var(--rn-font-ui);
    font-size: 15px;
    line-height: 1.35;
}

.rn-product-lines {
    margin-top: 34px;
    border: 1px solid #E4EAF0;
    border-radius: 18px;
    background: #FCFDFE;
}

.rn-product-lines-head,
.rn-product-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 58px 58px 100px;
    gap: 16px;
    align-items: center;
}

.rn-product-lines-head {
    padding: 13px 18px;
    border-bottom: 1px solid #E9EEF2;
    color: #8A97A8;
    font-family: var(--rn-font-ui);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.rn-product-line {
    padding: 19px 18px 21px;
    color: #516175;
    font-family: var(--rn-font-ui);
    font-size: 12px;
}
.rn-product-line > span:nth-child(n+2),
.rn-product-line > strong { text-align: right; }
.rn-product-line strong { color: var(--rn-ink); font-size: 13px; }
.rn-product-line small {
    display: block;
    margin-top: 4px;
    color: #8995A4;
    font-size: 10px;
}

.rn-product-facts {
    justify-content: flex-start;
    gap: clamp(34px, 6vw, 76px);
    margin-top: 28px;
    padding: 0 4px;
}

.rn-product-next {
    margin-top: auto;
    padding: 20px 22px;
    border: 1px solid rgba(1, 102, 255, 0.12);
    border-radius: 18px;
    background: #F7FAFF;
}
.rn-product-next-action {
    flex: 0 0 auto;
    color: var(--rn-blue);
    font-family: var(--rn-font-ui);
    font-size: 12px;
    font-weight: 800;
}

.rn-product-preview-wrap {
    padding: clamp(26px, 3.5vw, 42px);
    border-left: 1px solid rgba(0, 22, 52, 0.06);
    background: #F1F5F8;
}

.rn-product-preview-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
    color: #637387;
    font-family: var(--rn-font-ui);
    font-size: 12px;
    font-weight: 700;
}

.rn-invoice-paper {
    min-height: 470px;
    padding: 34px 30px;
    background: #FFFFFF;
    box-shadow: 0 16px 45px rgba(0, 22, 52, 0.09);
}

.rn-invoice-paper-brand {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--rn-ink);
    font-family: var(--rn-font-ui);
    font-size: 10px;
    letter-spacing: 0.08em;
}
.rn-invoice-mini-mark {
    width: 16px;
    height: 16px;
    border-radius: 5px;
    background: var(--rn-aqua);
}
.rn-invoice-paper-meta {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    margin-top: 40px;
    color: #7A899A;
    font-family: var(--rn-font-ui);
    font-size: 9px;
}
.rn-invoice-paper-meta strong { color: var(--rn-ink); }
.rn-invoice-paper-rule {
    height: 1px;
    margin: 18px 0 24px;
    background: #DCE4EA;
}
.rn-invoice-paper-row {
    width: 74%;
    height: 8px;
    margin-top: 11px;
    border-radius: 999px;
    background: #E8EDF1;
}
.rn-invoice-paper-row--wide { width: 92%; }
.rn-invoice-paper-row--short { width: 48%; }
.rn-invoice-paper-table {
    display: grid;
    grid-template-columns: 1fr 0.35fr 0.45fr;
    gap: 8px;
    margin-top: 42px;
    padding-top: 16px;
    border-top: 1px solid #E1E7EC;
}
.rn-invoice-paper-table span {
    height: 72px;
    border-radius: 4px;
    background: #F0F3F6;
}
.rn-invoice-paper-total {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-top: 34px;
    color: #768596;
    font-family: var(--rn-font-ui);
    font-size: 9px;
    letter-spacing: 0.08em;
}
.rn-invoice-paper-total strong {
    color: var(--rn-ink);
    font-size: 18px;
    letter-spacing: -0.03em;
}

/* Three principles, deliberately editorial rather than boxed cards. */
.rn-principles {
    padding: clamp(110px, 13vw, 180px) 0 clamp(85px, 10vw, 130px);
}
.rn-section-heading--principles { margin-bottom: 38px; }
.rn-principles-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid rgba(0, 22, 52, 0.13);
}
.rn-principles-grid article {
    position: relative;
    min-height: 320px;
    padding: 38px clamp(28px, 4vw, 58px) 34px 0;
}
.rn-principles-grid article + article {
    padding-left: clamp(28px, 4vw, 58px);
    border-left: 1px solid rgba(0, 22, 52, 0.10);
}
.rn-principle-number {
    color: var(--rn-blue);
    font-family: var(--rn-font-ui);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.1em;
}
.rn-principles-grid h3 {
    margin: clamp(62px, 7vw, 94px) 0 0;
    color: var(--rn-ink);
    font-family: var(--rn-font-headline);
    font-size: clamp(34px, 3.3vw, 46px);
    font-weight: 500;
    line-height: 1;
    letter-spacing: -0.045em;
}
.rn-principles-grid p {
    max-width: 265px;
    margin: 20px 0 0;
    color: #617186;
    font-family: var(--rn-font-ui);
    font-size: 15px;
    line-height: 1.5;
}

/* The public site is now longer than one viewport, so the footer follows the
 * story naturally instead of using the large provisional 01.1A spacer. */
.rn-site-footer--landing { padding-top: 48px; }

@media (max-width: 1120px) and (min-width: 861px) {
    .rn-journey-list { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 72px; }
    .rn-journey-list::before { display: none; }
    .rn-journey-step { padding-right: 30px; }
    .rn-journey-step:nth-child(3n) { padding-right: 0; }
}

@media (max-width: 1040px) {
    .rn-story-intro-inner { grid-template-columns: minmax(0, 1fr) 90px; }
    .rn-product-layout { grid-template-columns: minmax(0, 1.18fr) minmax(290px, 0.82fr); }
    .rn-product-lines-head,
    .rn-product-line { grid-template-columns: minmax(0, 1fr) 48px 50px 88px; gap: 10px; }
}

@media (max-width: 860px) {
    .rn-story-intro-inner { grid-template-columns: 1fr; }
    .rn-story-signature { display: none; }
    .rn-story-copy h2 { max-width: 700px; }

    .rn-journey-list {
        grid-template-columns: 1fr;
        gap: 0;
        padding-left: 5px;
    }
    .rn-journey-list::before {
        top: 28px;
        bottom: 28px;
        left: 31px;
        right: auto;
        width: 1px;
        height: auto;
        background: linear-gradient(180deg, rgba(1, 102, 255, 0.16), rgba(1, 102, 255, 0.52), rgba(87, 214, 195, 0.48));
    }
    .rn-journey-step {
        display: grid;
        grid-template-columns: 78px 1fr;
        align-items: start;
        min-height: 132px;
        padding: 0 0 24px;
    }
    .rn-journey-marker { margin: 0; }
    .rn-journey-step h3 { padding-top: 3px; }
    .rn-journey-step p { max-width: 320px; }

    .rn-product-stage { padding-inline: 0; }
    .rn-product-layout { grid-template-columns: 1fr; }
    .rn-product-preview-wrap { border-left: 0; border-top: 1px solid rgba(0, 22, 52, 0.06); }
    .rn-invoice-paper { max-width: 520px; margin-inline: auto; }

    .rn-principles-grid { grid-template-columns: 1fr; }
    .rn-principles-grid article {
        min-height: 0;
        padding: 34px 0 48px;
    }
    .rn-principles-grid article + article {
        padding-left: 0;
        border-left: 0;
        border-top: 1px solid rgba(0, 22, 52, 0.10);
    }
    .rn-principles-grid h3 { margin-top: 36px; }
    .rn-principles-grid p { max-width: 500px; }
}

@media (max-width: 680px) {
    .rn-story-intro { padding: 105px 0 92px; }
    .rn-story-eyebrow { margin-bottom: 18px; font-size: 10px; }
    .rn-story-copy h2 { font-size: clamp(38px, 10vw, 46px); }
    .rn-story-lead { margin-top: 28px; font-size: 18px; line-height: 1.5; }
    .rn-story-jump { margin-top: 28px; }

    .rn-journey { padding: 78px 0 110px; }
    .rn-section-heading--journey { margin-bottom: 56px; }
    .rn-section-heading h2 { font-size: clamp(34px, 9vw, 44px); }

    .rn-product-proof { padding: 80px 0 110px; }
    .rn-section-heading--product { margin-bottom: 54px; }
    .rn-section-heading > p:last-child:not(.rn-story-eyebrow) { margin-top: 22px; font-size: 17px; }
    .rn-product-window { border-radius: 22px; }
    .rn-product-topbar { min-height: 76px; padding: 17px 18px; }
    .rn-product-mark { width: 34px; height: 34px; }
    .rn-product-editor { padding: 26px 18px; }
    .rn-product-context { align-items: flex-start; }
    .rn-product-lines-head { display: none; }
    .rn-product-line {
        grid-template-columns: 1fr auto;
        gap: 8px 16px;
        padding: 18px;
    }
    .rn-product-line > span:first-child { grid-column: 1 / -1; }
    .rn-product-line > span:nth-child(2)::before { content: "1 × "; color: #8995A4; }
    .rn-product-line > span:nth-child(2) { font-size: 0; }
    .rn-product-line > span:nth-child(2)::before { font-size: 11px; }
    .rn-product-line > span:nth-child(3) { display: none; }
    .rn-product-line > strong { grid-column: 2; grid-row: 2; }
    .rn-product-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
    .rn-product-next { align-items: flex-start; flex-direction: column; gap: 14px; }
    .rn-product-preview-wrap { padding: 26px 18px 30px; }
    .rn-invoice-paper { min-height: 390px; padding: 26px 22px; }
    .rn-invoice-paper-table span { height: 58px; }

    .rn-principles { padding: 86px 0 72px; }
    .rn-principles-grid h3 { font-size: clamp(36px, 9.5vw, 44px); }
}

@media (max-width: 390px) {
    .rn-story-copy h2 { font-size: 37px; }
    .rn-product-brandline strong { font-size: 14px; }
    .rn-demo-badge { padding-inline: 8px; }
    .rn-product-facts { grid-template-columns: 1fr; }
    .rn-invoice-paper { min-height: 350px; }
}

/* ================================================================
 * RAINNUM-WEB-01.1C.1 — Core Product Story / Invoicing +
 * VERI*FACTU + Guided Start.
 * WEB-01.1A.4 hero remains untouched above this point.
 * ================================================================ */

/* Secondary commercial headlines are intentionally one step below the hero.
 * 35 pt reference at desktop = ~46.7 CSS px. Nexa Heavy keeps presence while
 * tighter leading/tracking avoids competing with the main promise. */
.rn-story-copy h2,
.rn-section-heading h2,
.rn-capability-copy h2,
.rn-fiscal-copy h2 {
    font-family: "Nexa Heavy", "Nexa Bold", "Nexa", "Avenir Next", Montserrat, Arial, sans-serif;
    font-size: clamp(35px, 3.5vw, 47px);
    font-weight: 900;
    line-height: .96;
    letter-spacing: -.055em;
    text-wrap: balance;
}
.rn-story-copy h2 { max-width: 660px; }
.rn-story-lead {
    max-width: 650px;
    margin-top: 30px;
    font-size: clamp(17px, 1.35vw, 20px);
}
.rn-section-heading--journey { margin-bottom: clamp(60px, 7vw, 92px); }

.rn-capability {
    padding: clamp(115px, 13vw, 175px) 0;
}
.rn-capability-layout,
.rn-fiscal-layout {
    display: grid;
    grid-template-columns: minmax(290px, .66fr) minmax(0, 1.34fr);
    gap: clamp(48px, 7vw, 105px);
    align-items: center;
}
.rn-capability-copy,
.rn-fiscal-copy { min-width: 0; }
.rn-capability-copy h2,
.rn-fiscal-copy h2 { margin: 0; color: var(--rn-ink); }
.rn-capability-lead,
.rn-fiscal-copy > p:not(.rn-story-eyebrow) {
    margin: 25px 0 0;
    color: #586981;
    font-family: var(--rn-font-ui);
    font-size: 17px;
    line-height: 1.62;
}
.rn-capability-note {
    margin: 24px 0 0;
    padding-left: 17px;
    border-left: 2px solid var(--rn-aqua);
    color: #526A78;
    font-family: var(--rn-font-ui);
    font-size: 14px;
    line-height: 1.55;
}

.rn-benefit-list {
    display: grid;
    gap: 0;
    margin-top: 38px;
    border-top: 1px solid rgba(0, 22, 52, .11);
}
.rn-benefit-list article {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 13px;
    padding: 20px 0;
    border-bottom: 1px solid rgba(0, 22, 52, .08);
}
.rn-benefit-list article > span {
    padding-top: 2px;
    color: var(--rn-blue);
    font-family: var(--rn-font-ui);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
}
.rn-benefit-list strong {
    display: block;
    color: var(--rn-ink);
    font-family: var(--rn-font-ui);
    font-size: 14px;
    line-height: 1.35;
}
.rn-benefit-list p {
    margin: 5px 0 0;
    color: #6A798B;
    font-family: var(--rn-font-ui);
    font-size: 12px;
    line-height: 1.5;
}

/* Every atmospheric colour patch is deliberately very blurred. */
.rn-real-surface,
.rn-onboarding-demo,
.rn-fiscal-surface { position: relative; isolation: isolate; min-width: 0; }
.rn-atmosphere,
.rn-fiscal-glow {
    position: absolute;
    z-index: -1;
    display: block;
    border-radius: 50%;
    filter: blur(78px);
    transform: translateZ(0);
    pointer-events: none;
}
.rn-atmosphere--invoice-a {
    width: min(38vw, 480px);
    aspect-ratio: 1;
    top: -7%;
    right: -4%;
    background: rgba(87, 214, 195, .22);
}
.rn-atmosphere--invoice-b {
    width: min(34vw, 430px);
    aspect-ratio: 1;
    bottom: -8%;
    left: -7%;
    background: rgba(1, 102, 255, .11);
}

/* Marketing composition built from the real Rainnum invoice-builder language:
 * same five steps, same guided-panel structure and live paper preview. */
.rn-app-frame {
    overflow: hidden;
    border: 1px solid rgba(0, 22, 52, .09);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 38px 90px rgba(0, 22, 52, .13), 0 9px 24px rgba(0, 22, 52, .05);
}
.rn-app-frame-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 74px;
    padding: 18px 22px;
    border-bottom: 1px solid #E4EAF0;
}
.rn-app-frame-head > div { display: grid; gap: 3px; }
.rn-app-frame-head strong {
    color: var(--rn-ink);
    font-family: var(--rn-font-heavy);
    font-size: 17px;
    line-height: 1.2;
}
.rn-ui-kicker {
    color: #728296;
    font-family: var(--rn-font-ui);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .11em;
    text-transform: uppercase;
}
.rn-ui-kicker--light { color: #9FB4C9; }

.rn-manual-steps-demo {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    padding: 0 15px;
    border-bottom: 1px solid #E6ECF1;
    background: #FAFCFD;
}
.rn-manual-steps-demo > span {
    position: relative;
    display: grid;
    grid-template-columns: 25px 1fr;
    grid-template-rows: auto auto;
    column-gap: 8px;
    min-width: 0;
    padding: 13px 8px 12px;
    color: #5E7185;
    font-family: var(--rn-font-ui);
}
.rn-manual-steps-demo > span::after {
    content: "";
    position: absolute;
    left: 7px;
    right: 7px;
    bottom: -1px;
    height: 2px;
    background: transparent;
}
.rn-manual-steps-demo > span.is-active::after { background: var(--rn-blue); }
.rn-manual-steps-demo i {
    grid-row: 1 / 3;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 8px;
    background: #EEF3F7;
    color: #607489;
    font-style: normal;
    font-size: 9px;
    font-weight: 900;
}
.rn-manual-steps-demo .is-active i { background: var(--rn-blue); color: #fff; }
.rn-manual-steps-demo b {
    min-width: 0;
    overflow: hidden;
    color: var(--rn-ink);
    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.rn-manual-steps-demo small {
    min-width: 0;
    overflow: hidden;
    margin-top: 2px;
    color: #8795A5;
    font-size: 8px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.rn-invoice-demo-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.22fr) minmax(285px, .78fr);
    min-height: 505px;
}
.rn-invoice-demo-editor { padding: 28px 25px 24px; }
.rn-guided-panel-head-demo {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 12px;
    align-items: start;
}
.rn-guided-panel-head-demo > span {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: var(--rn-aqua-soft);
    color: #167B6C;
    font: 900 10px var(--rn-font-ui);
}
.rn-guided-panel-head-demo p {
    margin: 0 0 2px;
    color: #8492A1;
    font: 850 8px var(--rn-font-ui);
    letter-spacing: .08em;
}
.rn-guided-panel-head-demo h3 {
    margin: 0;
    color: var(--rn-ink);
    font: 900 19px/1.1 var(--rn-font-heavy);
    letter-spacing: -.035em;
}
.rn-guided-panel-head-demo small {
    display: block;
    margin-top: 4px;
    color: #7B8998;
    font: 10px/1.4 var(--rn-font-ui);
}
.rn-demo-customer {
    position: relative;
    display: grid;
    gap: 2px;
    margin-top: 25px;
    padding: 13px 68px 13px 14px;
    border: 1px solid #DCE5EA;
    border-radius: 12px;
    background: #F9FBFC;
    font-family: var(--rn-font-ui);
}
.rn-demo-customer span { color: #7C8A9A; font-size: 8px; font-weight: 800; }
.rn-demo-customer strong { color: var(--rn-ink); font-size: 11px; }
.rn-demo-customer em {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    padding: 4px 7px;
    border-radius: 999px;
    background: var(--rn-aqua-soft);
    color: #177B6D;
    font-size: 8px;
    font-style: normal;
    font-weight: 850;
}
.rn-demo-line {
    margin-top: 13px;
    padding: 14px;
    border: 1px solid #DEE6EB;
    border-radius: 12px;
    background: #fff;
}
.rn-demo-line-title { display: grid; gap: 2px; font-family: var(--rn-font-ui); }
.rn-demo-line-title span { color: #6F8091; font-size: 8px; font-weight: 800; }
.rn-demo-line-title strong { color: var(--rn-ink); font-size: 11px; }
.rn-demo-line-title small { color: #8A97A5; font-size: 8px; }
.rn-demo-fields {
    display: grid;
    grid-template-columns: .65fr 1fr .7fr 1fr;
    gap: 7px;
    margin-top: 13px;
}
.rn-demo-fields label {
    display: grid;
    gap: 4px;
    min-width: 0;
    font-family: var(--rn-font-ui);
}
.rn-demo-fields span { color: #718295; font-size: 7px; font-weight: 800; }
.rn-demo-fields b {
    display: flex;
    align-items: center;
    min-height: 34px;
    padding: 0 8px;
    border: 1px solid #DCE5EA;
    border-radius: 8px;
    background: #FCFDFE;
    color: #283A4D;
    font-size: 9px;
    font-weight: 700;
    white-space: nowrap;
}
.rn-demo-field-total b { border-color: #CFE0FB; background: #F7FAFF; color: var(--rn-blue); }
.rn-demo-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 16px;
    font-family: var(--rn-font-ui);
}
.rn-demo-actions button,
.rn-review-demo-actions button,
.rn-onboarding-actions-demo button {
    border: 0;
    cursor: default;
    pointer-events: none;
    font-family: var(--rn-font-ui);
    font-weight: 800;
}
.rn-demo-actions button {
    min-height: 32px;
    padding: 0 11px;
    border: 1px solid #DCE5EA;
    border-radius: 8px;
    background: #fff;
    color: #435B70;
    font-size: 9px;
}
.rn-demo-actions span { color: #7B8997; font-size: 8px; }

.rn-live-preview-demo {
    min-width: 0;
    padding: 25px 22px 22px;
    border-left: 1px solid #E4EAF0;
    background: #EEF3F5;
}
.rn-live-preview-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
}
.rn-live-preview-head > div { display: grid; gap: 3px; }
.rn-live-preview-head strong { color: var(--rn-ink); font: 900 14px var(--rn-font-heavy); }
.rn-live-preview-head em {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #4F6D66;
    font: 750 8px var(--rn-font-ui);
    font-style: normal;
}
.rn-live-preview-head em i { width: 6px; height: 6px; border-radius: 50%; background: var(--rn-aqua); box-shadow: 0 0 0 4px rgba(87,214,195,.13); }
.rn-paper-demo {
    max-width: 245px;
    min-height: 345px;
    margin-inline: auto;
    padding: 25px 22px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(0, 22, 52, .10);
    font-family: var(--rn-font-ui);
}
.rn-paper-demo-brand { display: flex; align-items: center; gap: 7px; color: var(--rn-ink); font-size: 7px; letter-spacing: .07em; }
.rn-paper-demo-brand span { width: 13px; height: 13px; border-radius: 4px; background: var(--rn-aqua); }
.rn-paper-demo-title { display: flex; justify-content: space-between; gap: 12px; margin-top: 26px; padding-bottom: 11px; border-bottom: 1px solid #DCE4E9; }
.rn-paper-demo-title small { color: #8190A0; font-size: 6px; }
.rn-paper-demo-title b { color: var(--rn-ink); font-size: 7px; }
.rn-paper-demo-party { display: grid; gap: 2px; margin-top: 18px; }
.rn-paper-demo-party span { color: #8996A4; font-size: 5.5px; letter-spacing: .08em; }
.rn-paper-demo-party b { color: var(--rn-ink); font-size: 7px; }
.rn-paper-demo-party small { color: #718294; font-size: 6px; }
.rn-paper-demo-table { display: flex; justify-content: space-between; gap: 12px; margin-top: 26px; padding: 12px 0; border-top: 1px solid #E0E6EA; border-bottom: 1px solid #E0E6EA; color: #506174; font-size: 6px; }
.rn-paper-demo-table b { color: var(--rn-ink); }
.rn-paper-demo-tax { display: grid; grid-template-columns: 1fr auto; gap: 5px 12px; margin-top: 18px; color: #748396; font-size: 5.7px; }
.rn-paper-demo-tax b { color: #425367; font-size: 6px; }
.rn-paper-demo-total { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-top: 24px; padding-top: 12px; border-top: 1px solid #DDE5EA; color: #7C8B9A; font-size: 6px; letter-spacing: .08em; }
.rn-paper-demo-total strong { color: var(--rn-ink); font-size: 14px; letter-spacing: -.03em; }
.rn-preview-total-demo { display: flex; justify-content: space-between; gap: 12px; margin-top: 13px; padding-top: 12px; border-top: 1px solid #D8E0E5; color: #68798A; font: 9px var(--rn-font-ui); }
.rn-preview-total-demo strong { color: var(--rn-ink); font-size: 12px; }

/* Dark interruption: fiscal complexity is visually contained inside Rainnum,
 * rather than making the whole public page feel technical. */
.rn-fiscal-story {
    position: relative;
    overflow: hidden;
    padding: clamp(125px, 14vw, 190px) 0;
    background: var(--rn-ink);
    color: #fff;
}
.rn-fiscal-story::before {
    content: "";
    position: absolute;
    width: min(48vw, 620px);
    aspect-ratio: 1;
    right: 7%;
    bottom: -33%;
    border-radius: 50%;
    background: rgba(1, 102, 255, .20);
    filter: blur(110px);
    pointer-events: none;
}
.rn-fiscal-copy h2 { color: #fff; max-width: 480px; }
.rn-story-eyebrow--inverse { color: #70A7FF; }
.rn-fiscal-copy > p:not(.rn-story-eyebrow) { color: #B9C8D8; max-width: 500px; }
.rn-dark-benefits {
    display: grid;
    gap: 0;
    max-width: 500px;
    margin-top: 34px;
    border-top: 1px solid rgba(255,255,255,.12);
}
.rn-dark-benefits article {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 12px;
    padding: 17px 0;
    border-bottom: 1px solid rgba(255,255,255,.10);
    font-family: var(--rn-font-ui);
}
.rn-dark-benefits i { padding-top: 2px; color: #70A7FF; font-size: 9px; font-style: normal; font-weight: 850; }
.rn-dark-benefits strong { display: block; color: #fff; font-size: 13px; }
.rn-dark-benefits span { display: block; margin-top: 4px; color: #9FB0C2; font-size: 11px; line-height: 1.45; }
.rn-fiscal-glow {
    width: 76%;
    aspect-ratio: 1.25;
    right: -11%;
    top: 3%;
    background: rgba(87, 214, 195, .13);
    filter: blur(100px);
}
.rn-review-demo {
    position: relative;
    overflow: hidden;
    padding: clamp(22px, 3vw, 32px);
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 24px;
    background: rgba(19, 42, 71, .78);
    box-shadow: 0 42px 90px rgba(0, 0, 0, .28);
    backdrop-filter: blur(10px);
    font-family: var(--rn-font-ui);
}
.rn-review-demo-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.rn-review-demo-head > div { display: grid; gap: 3px; }
.rn-review-demo-head span { color: #8FB5E7; font-size: 8px; font-weight: 800; letter-spacing: .06em; }
.rn-review-demo-head strong { color: #fff; font-family: var(--rn-font-heavy); font-size: 20px; line-height: 1.12; }
.rn-review-demo-head small { max-width: 430px; color: #9FB0C2; font-size: 9px; line-height: 1.45; }
.rn-review-demo-head em {
    flex: 0 0 auto;
    padding: 5px 8px;
    border-radius: 999px;
    background: rgba(87,214,195,.15);
    color: #8AE5D7;
    font-size: 8px;
    font-style: normal;
    font-weight: 850;
    letter-spacing: .07em;
}
.rn-review-demo-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin-top: 21px;
}
.rn-review-demo-grid article {
    display: grid;
    gap: 3px;
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 11px;
    background: rgba(255,255,255,.055);
}
.rn-review-demo-grid span { color: #8298B0; font-size: 7.5px; font-weight: 800; }
.rn-review-demo-grid strong { color: #F7FAFD; font-size: 10px; line-height: 1.35; }
.rn-review-demo-grid small { color: #95A7B9; font-size: 8px; }
.rn-review-demo-total {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-top: 11px;
    padding: 13px 2px;
    border-top: 1px solid rgba(255,255,255,.10);
    color: #A8B7C6;
    font-size: 9px;
}
.rn-review-demo-total strong { color: #fff; font-size: 16px; }
.rn-review-boundary-demo {
    display: grid;
    grid-template-columns: 28px 1fr;
    gap: 10px;
    padding: 13px;
    border: 1px solid rgba(112,167,255,.24);
    border-radius: 11px;
    background: rgba(1,102,255,.09);
}
.rn-review-boundary-demo i {
    display: grid;
    place-items: center;
    width: 25px;
    height: 25px;
    border-radius: 8px;
    background: rgba(112,167,255,.16);
    color: #80B2FF;
    font-size: 10px;
    font-style: normal;
    font-weight: 900;
}
.rn-review-boundary-demo strong { display: block; color: #fff; font-size: 10px; }
.rn-review-boundary-demo span { display: block; margin-top: 3px; color: #A1B1C2; font-size: 8px; line-height: 1.45; }
.rn-review-demo-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.rn-review-demo-actions button { min-height: 34px; padding: 0 11px; border-radius: 8px; font-size: 8px; }
.rn-review-demo-actions .is-secondary { border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.04); color: #D4DEE8; }
.rn-review-demo-actions .is-primary { background: #fff; color: var(--rn-ink); }
.rn-send-demo {
    display: grid;
    grid-template-columns: auto 1fr auto minmax(122px, auto);
    align-items: center;
    gap: 10px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(255,255,255,.10);
    color: #A6B5C5;
    font-size: 8px;
}
.rn-send-demo > strong { color: #fff; font-size: 9px; }
.rn-send-demo > i { color: #70A7FF; font-size: 14px; font-style: normal; }
.rn-send-demo > div { display: grid; gap: 1px; padding: 7px 9px; border-radius: 9px; background: rgba(87,214,195,.10); }
.rn-send-demo small { color: #8FB3AE; font-size: 7px; }
.rn-send-demo b { color: #8AE5D7; font-size: 9px; }

/* Guided start mirrors the real Welcome flow: five configuration steps plus
 * the real "Todo preparado" summary state. */
.rn-capability--start { padding-bottom: clamp(125px, 15vw, 200px); }
.rn-capability-layout--start { grid-template-columns: minmax(270px, .58fr) minmax(0, 1.42fr); }
.rn-atmosphere--start-a {
    width: min(42vw, 520px);
    aspect-ratio: 1;
    right: -7%;
    top: -8%;
    background: rgba(87, 214, 195, .18);
}
.rn-onboarding-shell {
    display: grid;
    grid-template-columns: minmax(235px, .72fr) minmax(0, 1.28fr);
    overflow: hidden;
    border: 1px solid rgba(0,22,52,.09);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 34px 80px rgba(0,22,52,.11), 0 8px 22px rgba(0,22,52,.04);
}
.rn-onboarding-nav-demo {
    min-width: 0;
    padding: 28px 24px;
    background: linear-gradient(155deg, var(--rn-ink), #153556);
    color: #fff;
}
.rn-onboarding-nav-demo h3 {
    max-width: 240px;
    margin: 8px 0 20px;
    color: #fff;
    font: 900 23px/1.06 var(--rn-font-heavy);
    letter-spacing: -.045em;
}
.rn-onboarding-nav-demo > p {
    margin: 17px 0 0;
    color: #9EB2C6;
    font: 8px/1.5 var(--rn-font-ui);
}
.rn-onboarding-steps-demo { display: grid; }
.rn-onboarding-steps-demo article {
    position: relative;
    display: grid;
    grid-template-columns: 31px 1fr 15px;
    gap: 10px;
    align-items: center;
    min-height: 62px;
    border-bottom: 1px solid rgba(255,255,255,.09);
    font-family: var(--rn-font-ui);
}
.rn-onboarding-steps-demo article > span {
    display: grid;
    place-items: center;
    width: 29px;
    height: 29px;
    border-radius: 9px;
    background: rgba(87,214,195,.12);
    color: #8AE5D7;
    font-size: 8px;
    font-weight: 900;
}
.rn-onboarding-steps-demo article > div { min-width: 0; }
.rn-onboarding-steps-demo strong { display: block; color: #fff; font-size: 9px; }
.rn-onboarding-steps-demo small { display: block; margin-top: 2px; color: #91A6BA; font-size: 7px; line-height: 1.35; }
.rn-onboarding-steps-demo article > b { color: var(--rn-aqua); font-size: 9px; }
.rn-onboarding-steps-demo article.is-active::after {
    content: "";
    position: absolute;
    left: -24px;
    top: 9px;
    bottom: 9px;
    width: 3px;
    border-radius: 3px;
    background: var(--rn-aqua);
}
.rn-onboarding-panel-demo { min-width: 0; padding: 28px; background: #FCFDFE; }
.rn-finish-demo {
    position: relative;
    overflow: hidden;
    padding: 21px;
    border: 1px solid #CDEBE5;
    border-radius: 16px;
    background: linear-gradient(135deg, #F4FCFA, #fff);
}
.rn-finish-demo::after {
    content: "";
    position: absolute;
    width: 150px;
    aspect-ratio: 1;
    right: -50px;
    bottom: -70px;
    border-radius: 50%;
    background: rgba(87,214,195,.20);
    filter: blur(42px);
}
.rn-finish-demo h3 {
    position: relative;
    max-width: 480px;
    margin: 5px 0 8px;
    color: var(--rn-ink);
    font: 900 22px/1.06 var(--rn-font-heavy);
    letter-spacing: -.04em;
}
.rn-finish-demo p { position: relative; max-width: 500px; margin: 0; color: #68798A; font: 10px/1.5 var(--rn-font-ui); }
.rn-summary-demo-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 13px;
}
.rn-summary-demo-grid article {
    display: grid;
    grid-template-columns: 14px 1fr auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 11px;
    border: 1px solid #DEE6EB;
    border-radius: 10px;
    background: #fff;
    font-family: var(--rn-font-ui);
}
.rn-summary-demo-grid i { color: #39AE9E; font-size: 8px; font-style: normal; }
.rn-summary-demo-grid strong { display: block; color: var(--rn-ink); font-size: 9px; }
.rn-summary-demo-grid small { display: block; margin-top: 1px; color: #79899A; font-size: 7px; }
.rn-summary-demo-grid em { color: #728498; font-size: 7px; font-style: normal; font-weight: 750; }
.rn-onboarding-safe-demo {
    margin-top: 12px;
    padding: 10px 11px;
    border-left: 3px solid var(--rn-aqua);
    border-radius: 8px;
    background: #F4FBF9;
    color: #4D6A62;
    font: 8px/1.5 var(--rn-font-ui);
}
.rn-onboarding-actions-demo { display: flex; justify-content: space-between; gap: 12px; margin-top: 17px; padding-top: 14px; border-top: 1px solid #E1E8ED; }
.rn-onboarding-actions-demo button { min-height: 34px; padding: 0 12px; border-radius: 8px; background: var(--rn-ink); color: #fff; font-size: 8px; }

@media (max-width: 1080px) {
    .rn-capability-layout,
    .rn-fiscal-layout,
    .rn-capability-layout--start { grid-template-columns: 1fr; gap: 58px; }
    .rn-capability-copy,
    .rn-fiscal-copy { max-width: 720px; }
    .rn-benefit-list { max-width: 720px; }
    .rn-fiscal-copy h2 { max-width: 650px; }
    .rn-dark-benefits { max-width: 720px; grid-template-columns: repeat(3, 1fr); border-top: 0; gap: 10px; }
    .rn-dark-benefits article { grid-template-columns: 24px 1fr; padding: 13px; border: 1px solid rgba(255,255,255,.10); border-radius: 10px; }
}

@media (max-width: 760px) {
    .rn-story-copy h2,
    .rn-section-heading h2,
    .rn-capability-copy h2,
    .rn-fiscal-copy h2 { font-size: clamp(34px, 10vw, 42px); line-height: .98; }
    .rn-capability { padding: 92px 0; }
    .rn-capability-layout,
    .rn-fiscal-layout,
    .rn-capability-layout--start { gap: 40px; }
    .rn-app-frame { border-radius: 18px; }
    .rn-app-frame-head { min-height: 67px; padding: 14px 15px; }
    .rn-app-frame-head strong { font-size: 15px; }
    .rn-manual-steps-demo { grid-template-columns: repeat(5, minmax(88px, 1fr)); overflow-x: auto; padding-inline: 7px; scrollbar-width: thin; }
    .rn-manual-steps-demo > span { min-width: 88px; padding-inline: 6px; }
    .rn-invoice-demo-layout { grid-template-columns: 1fr; }
    .rn-live-preview-demo { border-left: 0; border-top: 1px solid #E4EAF0; }
    .rn-paper-demo { max-width: 270px; }
    .rn-demo-fields { grid-template-columns: 1fr 1fr; }
    .rn-fiscal-story { padding: 95px 0; }
    .rn-dark-benefits { grid-template-columns: 1fr; }
    .rn-review-demo { border-radius: 18px; padding: 18px; }
    .rn-review-demo-grid { grid-template-columns: 1fr; }
    .rn-review-demo-actions { flex-direction: column; }
    .rn-review-demo-actions button { width: 100%; }
    .rn-send-demo { grid-template-columns: 1fr auto; }
    .rn-send-demo > span { grid-column: 1; }
    .rn-send-demo > strong { grid-column: 1; }
    .rn-send-demo > i { grid-column: 2; grid-row: 1 / 3; }
    .rn-send-demo > div { grid-column: 1 / -1; }
    .rn-onboarding-shell { grid-template-columns: 1fr; border-radius: 18px; }
    .rn-onboarding-nav-demo { padding: 24px 20px; }
    .rn-onboarding-nav-demo h3 { max-width: 360px; }
    .rn-onboarding-panel-demo { padding: 20px; }
    .rn-summary-demo-grid { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
    .rn-demo-fields { grid-template-columns: 1fr; }
    .rn-demo-actions { align-items: flex-start; flex-direction: column; }
    .rn-review-demo-head { flex-direction: column; }
}

/* Contain decorative blur and bounded horizontal steppers without allowing the
 * public page itself to acquire a sideways scrollbar on narrow devices. */
.rn-site-shell,
.rn-main--landing { overflow-x: clip; }

/* ================================================================
 * RAINNUM-WEB-01.1C.2 — Daily Business / Invoice Design /
 * Collections / Automation.
 * Existing hero, journey, invoicing, PRE and guided start remain intact.
 * ================================================================ */
.rn-story-section--white { background: #fff; }
.rn-story-section--tinted { background: #EEF5FA; }
.rn-capability-layout--reverse { grid-template-columns: minmax(0, 1.34fr) minmax(290px, .66fr); }
.rn-capability-layout--reverse .rn-capability-copy { order: 2; }
.rn-capability-layout--reverse .rn-real-surface { order: 1; }

/* All decorative colour in product stories is atmospheric: deliberately soft,
 * oversized and heavily blurred so it never reads as a literal circle. */
.rn-real-surface { position: relative; min-width: 0; }
.rn-atmosphere--design-a { width: 290px; height: 290px; top: -95px; right: -45px; background: rgba(87,214,195,.36); filter: blur(84px); }
.rn-atmosphere--design-b { width: 250px; height: 250px; bottom: -80px; left: -60px; background: rgba(1,102,255,.18); filter: blur(92px); }
.rn-atmosphere--memory-a { width: 330px; height: 330px; top: 10%; left: 5%; background: rgba(1,102,255,.12); filter: blur(105px); }
.rn-atmosphere--tax-a { width: 340px; height: 340px; bottom: -90px; right: 2%; background: rgba(87,214,195,.25); filter: blur(110px); }
.rn-atmosphere--collections-a { width: 360px; height: 360px; top: -80px; right: -60px; background: rgba(1,102,255,.12); filter: blur(115px); }
.rn-atmosphere--sepa-a { width: 300px; height: 300px; bottom: -65px; left: -55px; background: rgba(87,214,195,.24); filter: blur(100px); }
.rn-atmosphere--recurrence-a { width: 330px; height: 330px; top: 15%; right: 0; background: rgba(1,102,255,.12); filter: blur(105px); }
.rn-atmosphere--tasks-a { width: 340px; height: 340px; top: -75px; left: 25%; background: rgba(87,214,195,.22); filter: blur(110px); }

/* Invoice designer — editorial recreation of the real Settings / Welcome UI. */
.rn-designer-demo { overflow: hidden; }
.rn-designer-demo-grid { display: grid; grid-template-columns: minmax(270px,.9fr) minmax(260px,1.1fr); min-height: 505px; }
.rn-designer-demo-controls { padding: 24px; background: #fff; border-right: 1px solid #E4EAF0; font-family: var(--rn-font-ui); }
.rn-demo-setting-head { display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: start; margin-bottom: 20px; }
.rn-demo-setting-head > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; background: var(--rn-ink); color: #fff; font-size: 9px; font-weight: 800; }
.rn-demo-setting-head strong { display:block; color:var(--rn-ink); font-size:15px; }
.rn-demo-setting-head small { display:block; margin-top:2px; color:#718095; font-size:10px; }
.rn-logo-demo { display:flex; align-items:center; gap:12px; padding:13px; border:1px solid #E1E8ED; border-radius:12px; }
.rn-logo-demo-preview { display:grid; place-items:center; width:58px; height:44px; border-radius:9px; background:#F2F7FA; border:1px dashed #C8D4DC; }
.rn-logo-demo-preview span { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--rn-aqua); color:var(--rn-ink); font-weight:900; }
.rn-logo-demo strong, .rn-logo-demo small { display:block; }
.rn-logo-demo strong { color:var(--rn-ink); font-size:11px; }
.rn-logo-demo small { margin-top:2px; color:#7A899A; font-size:8px; }
.rn-layout-demo { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:15px; }
.rn-layout-demo > span { padding:9px; border:1px solid #E2E8ED; border-radius:10px; text-align:center; background:#fff; }
.rn-layout-demo > span.is-selected { border-color:#8FB9FF; box-shadow:0 0 0 2px rgba(1,102,255,.08); background:#F8FBFF; }
.rn-layout-demo i { display:block; height:40px; margin-bottom:7px; border-radius:5px; background:linear-gradient(180deg,#fff 0 22%,#EAF0F4 22% 26%,#fff 26% 100%); border:1px solid #DDE5EB; }
.rn-layout-demo b { color:var(--rn-ink); font-size:8px; }
.rn-design-color-demo { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:15px; }
.rn-design-color-demo label, .rn-design-row-demo { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:10px; border:1px solid #E4EAF0; border-radius:9px; color:#718095; font-size:8px; }
.rn-design-color-demo label { align-items:flex-start; flex-direction:column; }
.rn-design-color-demo b { display:flex; align-items:center; gap:6px; color:var(--rn-ink); font-size:8px; }
.rn-design-color-demo i { width:13px; height:13px; border-radius:50%; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08); }
.rn-design-color-demo i.is-ink { background:#001634; }.rn-design-color-demo i.is-aqua { background:#DFF8F3; }
.rn-design-row-demo { margin-top:8px; }.rn-design-row-demo strong { color:var(--rn-ink); font-size:8px; }
.rn-designer-demo-preview { padding:24px; background:#F1F5F8; }
.rn-design-paper { width:min(100%,275px); min-height:370px; margin:22px auto 0; padding:25px 22px; background:#fff; box-shadow:0 12px 30px rgba(0,22,52,.08); color:#26384B; font-family:var(--rn-font-ui); }
.rn-design-paper-logo { display:flex; align-items:center; gap:8px; }.rn-design-paper-logo span { width:18px; height:18px; border-radius:6px; background:var(--rn-aqua); }.rn-design-paper-logo strong { font-size:8px; }
.rn-design-paper-meta { display:flex; justify-content:space-between; margin-top:22px; padding-bottom:12px; border-bottom:2px solid var(--rn-ink); }.rn-design-paper-meta small{font-size:7px}.rn-design-paper-meta b{font-size:8px}
.rn-design-paper-parties { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:13px 0 25px; color:#718095; font-size:6px; }
.rn-design-paper-line { display:flex; justify-content:space-between; gap:8px; padding:8px 0; border-bottom:1px solid #E7ECEF; font-size:7px; }.rn-design-paper-line.is-soft{color:#758599}
.rn-design-paper-total { display:flex; justify-content:space-between; align-items:end; margin-top:24px; }.rn-design-paper-total span{font-size:6px}.rn-design-paper-total strong{color:var(--rn-ink);font-size:16px}

/* Customer and commercial concept memory. */
.rn-memory-demo { position:relative; display:grid; grid-template-columns:.84fr 1.16fr; gap:14px; }
.rn-memory-demo > article { position:relative; z-index:1; min-width:0; padding:22px; border:1px solid #DFE7EC; border-radius:18px; background:#fff; box-shadow:0 18px 50px rgba(0,22,52,.07); font-family:var(--rn-font-ui); }
.rn-mini-surface-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding-bottom:14px; border-bottom:1px solid #E7ECEF; }
.rn-mini-surface-head strong { display:block; margin-top:2px; color:var(--rn-ink); font-size:14px; }.rn-mini-surface-head em { padding:4px 7px; border-radius:999px; background:#DDF7EF; color:#16866D; font-size:7px; font-style:normal; font-weight:800; }
.rn-mini-action { align-self:center; padding:6px 9px; border:1px solid #CBD8E1; border-radius:7px; color:var(--rn-ink); font-size:7px; font-weight:800; white-space:nowrap; }.rn-mini-action--primary{background:var(--rn-ink);border-color:var(--rn-ink);color:#fff}
.rn-customer-facts-demo { display:grid; gap:9px; margin-top:14px; }.rn-customer-facts-demo span{padding:9px;border-radius:9px;background:#F7FAFB}.rn-customer-facts-demo small,.rn-customer-facts-demo b{display:block}.rn-customer-facts-demo small{color:#7A899A;font-size:7px}.rn-customer-facts-demo b{margin-top:1px;color:var(--rn-ink);font-size:9px}
.rn-linked-concepts-demo { margin-top:16px; }.rn-linked-concepts-demo > div { margin-top:8px; padding:9px 10px; border:1px solid #E1E8ED; border-radius:9px; }.rn-linked-concepts-demo b,.rn-linked-concepts-demo small{display:block}.rn-linked-concepts-demo b{color:var(--rn-ink);font-size:9px}.rn-linked-concepts-demo small{color:#718095;font-size:7px}
.rn-concept-kpis-demo { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:14px; }.rn-concept-kpis-demo span{padding:9px;border-radius:9px;background:#F5F8FA}.rn-concept-kpis-demo small,.rn-concept-kpis-demo b{display:block}.rn-concept-kpis-demo small{color:#7A899A;font-size:7px}.rn-concept-kpis-demo b{color:var(--rn-ink);font-size:15px}
.rn-concept-list-demo { margin-top:13px; border-top:1px solid #E4EAF0; }.rn-concept-list-demo > div{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #E7ECEF}.rn-concept-list-demo b,.rn-concept-list-demo small{display:block}.rn-concept-list-demo b{color:var(--rn-ink);font-size:9px}.rn-concept-list-demo small{color:#8291A0;font-size:7px}.rn-concept-list-demo em{color:var(--rn-ink);font-size:8px;font-style:normal;font-weight:800}.rn-concept-list-demo i{padding:4px 6px;border-radius:999px;background:#EAF3FF;color:#0166FF;font-size:7px;font-style:normal;font-weight:800}

/* Fiscal flexibility — Multi-IVA and customer equivalence-surcharge context. */
.rn-tax-callouts { display:grid; gap:9px; margin-top:30px; }.rn-tax-callouts > span{display:grid;grid-template-columns:180px 1fr;gap:15px;padding:12px 0;border-top:1px solid rgba(0,22,52,.09)}.rn-tax-callouts b{color:var(--rn-ink);font-size:13px}.rn-tax-callouts small{color:#617288;font:12px/1.45 var(--rn-font-ui)}
.rn-tax-demo { overflow:hidden; }.rn-tax-customer-demo { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:17px 21px; background:#fff; border-bottom:1px solid #E3E9ED; font-family:var(--rn-font-ui); }.rn-tax-customer-demo > div span,.rn-tax-customer-demo > div strong{display:block}.rn-tax-customer-demo > div span{color:#8291A0;font-size:7px}.rn-tax-customer-demo > div strong{color:var(--rn-ink);font-size:11px}.rn-tax-toggle-demo{display:grid;grid-template-columns:27px 1fr;align-items:center;gap:1px 9px;padding:8px 10px;border-radius:10px;background:#F3FBF8}.rn-tax-toggle-demo i{grid-row:1/3;position:relative;width:26px;height:15px;border-radius:999px;background:var(--rn-aqua)}.rn-tax-toggle-demo i:after{content:"";position:absolute;right:2px;top:2px;width:11px;height:11px;border-radius:50%;background:#fff}.rn-tax-toggle-demo b{color:var(--rn-ink);font-size:8px}.rn-tax-toggle-demo small{color:#5E7B74;font-size:6px}
.rn-tax-table-demo { padding:16px 21px 4px; background:#fff; font-family:var(--rn-font-ui); }.rn-tax-table-demo > div{display:grid;grid-template-columns:1fr 72px 90px;gap:12px;align-items:center;padding:12px 8px;border-bottom:1px solid #E7ECEF}.rn-tax-table-demo .is-head{padding-top:5px;color:#8190A0;font-size:7px;text-transform:uppercase;letter-spacing:.08em}.rn-tax-table-demo b,.rn-tax-table-demo small{display:block}.rn-tax-table-demo b{color:var(--rn-ink);font-size:10px}.rn-tax-table-demo small{color:#7A899A;font-size:7px}.rn-tax-table-demo em{justify-self:start;padding:5px 8px;border-radius:999px;background:#EAF3FF;color:#0166FF;font-size:8px;font-style:normal;font-weight:800}.rn-tax-table-demo strong{justify-self:end;color:var(--rn-ink);font-size:10px}
.rn-tax-summary-demo { display:grid;grid-template-columns:repeat(4,1fr);gap:1px;padding:18px 21px 21px;background:#F4F8FA;font-family:var(--rn-font-ui)}.rn-tax-summary-demo span{padding:8px 10px;border-left:1px solid #DDE5EB}.rn-tax-summary-demo span:first-child{border-left:0}.rn-tax-summary-demo small,.rn-tax-summary-demo b,.rn-tax-summary-demo strong{display:block}.rn-tax-summary-demo small{color:#7C8B9B;font-size:7px}.rn-tax-summary-demo b{margin-top:2px;color:var(--rn-ink);font-size:9px}.rn-tax-summary-demo .is-total strong{font-size:14px;color:var(--rn-ink)}

/* Collections / aging / real economic-state story. */
.rn-collections-demo { overflow:hidden; }.rn-collection-kpis-demo { display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:#fff;border-bottom:1px solid #E3E9ED;font-family:var(--rn-font-ui)}.rn-collection-kpis-demo > span{padding:15px 13px;border-left:1px solid #E7ECEF}.rn-collection-kpis-demo > span:first-child{border-left:0}.rn-collection-kpis-demo small,.rn-collection-kpis-demo b,.rn-collection-kpis-demo em{display:block}.rn-collection-kpis-demo small{color:#7C8B9B;font-size:7px}.rn-collection-kpis-demo b{margin-top:3px;color:var(--rn-ink);font-size:14px}.rn-collection-kpis-demo em{margin-top:1px;color:#8390A0;font-size:6px;font-style:normal}.rn-collection-kpis-demo .is-overdue b{color:#B4493F}.rn-collection-kpis-demo .is-accent{background:#F1FBF8}.rn-collection-kpis-demo .is-accent b{color:#16866D}
.rn-aging-demo { padding:17px 20px 10px;background:#F7FAFB;font-family:var(--rn-font-ui)}.rn-aging-demo > div{display:grid;grid-template-columns:100px 1fr 80px;gap:10px;align-items:center;margin-bottom:9px}.rn-aging-demo span{color:#607187;font-size:8px}.rn-aging-demo i{height:6px;border-radius:999px;background:#E3EAF0;overflow:hidden}.rn-aging-demo i b{display:block;height:100%;border-radius:999px;background:#8BB7FF}.rn-aging-demo strong{justify-self:end;color:var(--rn-ink);font-size:8px}
.rn-collection-list-demo { padding:3px 20px 18px;background:#fff;font-family:var(--rn-font-ui)}.rn-collection-list-demo > div{display:grid;grid-template-columns:1fr auto 90px;gap:11px;align-items:center;padding:11px 0;border-bottom:1px solid #E7ECEF}.rn-collection-list-demo span b,.rn-collection-list-demo span small{display:block}.rn-collection-list-demo span b{color:var(--rn-ink);font-size:9px}.rn-collection-list-demo span small{color:#7A899A;font-size:7px}.rn-collection-list-demo em{padding:4px 7px;border-radius:999px;font-size:7px;font-style:normal;font-weight:800}.rn-collection-list-demo em.is-pending{background:#FFF5DE;color:#96701F}.rn-collection-list-demo em.is-overdue{background:#FCEBE9;color:#B4493F}.rn-collection-list-demo em.is-paid{background:#DDF7EF;color:#16866D}.rn-collection-list-demo > div > strong{justify-self:end;color:var(--rn-ink);font-size:9px}

/* SEPA CORE — keeps the product boundary explicit: prepare/validate/download. */
.rn-sepa-demo { overflow:hidden; }.rn-sepa-kpis-demo { display:grid;grid-template-columns:repeat(3,1fr);background:#fff;border-bottom:1px solid #E3E9ED;font-family:var(--rn-font-ui)}.rn-sepa-kpis-demo span{padding:16px;border-left:1px solid #E7ECEF}.rn-sepa-kpis-demo span:first-child{border-left:0}.rn-sepa-kpis-demo small,.rn-sepa-kpis-demo b,.rn-sepa-kpis-demo em{display:block}.rn-sepa-kpis-demo small{color:#7C8B9B;font-size:7px}.rn-sepa-kpis-demo b{margin-top:2px;color:var(--rn-ink);font-size:16px}.rn-sepa-kpis-demo em{color:#7A899A;font-size:7px;font-style:normal}.rn-sepa-kpis-demo .is-accent{background:#F2FBF8}.rn-sepa-creditor-demo{display:flex;align-items:center;gap:10px;margin:14px 18px 0;padding:10px 12px;border-radius:10px;background:#EFF9F5;font-family:var(--rn-font-ui)}.rn-sepa-creditor-demo i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#D3F3E8;color:#128169;font-style:normal;font-weight:900}.rn-sepa-creditor-demo strong,.rn-sepa-creditor-demo small{display:block}.rn-sepa-creditor-demo strong{color:var(--rn-ink);font-size:9px}.rn-sepa-creditor-demo small{color:#668177;font-size:7px}
.rn-sepa-draft-demo { display:flex;justify-content:space-between;align-items:center;gap:15px;margin:13px 18px;padding:13px;border:1px solid #E0E7EC;border-radius:11px;background:#fff;font-family:var(--rn-font-ui)}.rn-sepa-draft-demo strong,.rn-sepa-draft-demo small{display:block}.rn-sepa-draft-demo strong{margin-top:2px;color:var(--rn-ink);font-size:11px}.rn-sepa-draft-demo small{color:#768698;font-size:7px}.rn-sepa-draft-demo em{padding:5px 8px;border-radius:999px;background:#FFF4D8;color:#916B1B;font-size:7px;font-style:normal;font-weight:800}
.rn-sepa-artifact-demo { display:flex;justify-content:space-between;align-items:center;gap:15px;margin:0 18px 18px;padding:13px;border-radius:11px;background:#F5F8FA;font-family:var(--rn-font-ui)}.rn-sepa-artifact-demo span,.rn-sepa-artifact-demo strong,.rn-sepa-artifact-demo code{display:block}.rn-sepa-artifact-demo span{color:#748599;font-size:7px}.rn-sepa-artifact-demo strong{margin-top:1px;color:var(--rn-ink);font-size:9px}.rn-sepa-artifact-demo code{margin-top:2px;color:#607188;font-size:6px}

/* Recurrences — reminder/preparation, not automatic fiscal emission. */
.rn-recurrence-demo { overflow:hidden; }.rn-recurrence-kpis-demo { display:grid;grid-template-columns:repeat(3,1fr);background:#fff;border-bottom:1px solid #E3E9ED;font-family:var(--rn-font-ui)}.rn-recurrence-kpis-demo > span{padding:15px;border-left:1px solid #E7ECEF}.rn-recurrence-kpis-demo > span:first-child{border-left:0}.rn-recurrence-kpis-demo small,.rn-recurrence-kpis-demo b,.rn-recurrence-kpis-demo em{display:block}.rn-recurrence-kpis-demo small{color:#7C8B9B;font-size:7px}.rn-recurrence-kpis-demo b{color:var(--rn-ink);font-size:16px}.rn-recurrence-kpis-demo em{color:#7B8A9A;font-size:6px;font-style:normal}.rn-recurrence-kpis-demo .is-accent{background:#F1FBF8}.rn-recurrence-kpis-demo .is-accent b{color:#16866D}
.rn-recurrence-list-demo{padding:15px 18px 18px;background:#fff;font-family:var(--rn-font-ui)}.rn-recurrence-list-demo > div{display:grid;grid-template-columns:1.3fr .65fr 1fr .55fr;gap:10px;align-items:center;padding:11px 8px;border-bottom:1px solid #E7ECEF}.rn-recurrence-list-demo .is-head{padding-top:2px;color:#8190A0;font-size:7px;text-transform:uppercase;letter-spacing:.06em}.rn-recurrence-list-demo span b,.rn-recurrence-list-demo span small{display:block}.rn-recurrence-list-demo span b{color:var(--rn-ink);font-size:9px}.rn-recurrence-list-demo span small{color:#7A899A;font-size:7px}.rn-recurrence-list-demo em{color:#566A82;font-size:8px;font-style:normal}.rn-recurrence-list-demo i{justify-self:start;padding:4px 7px;border-radius:999px;background:#EAF3FF;color:#0166FF;font-size:7px;font-style:normal;font-weight:800}.rn-recurrence-list-demo i.is-paused{background:#EFF1F3;color:#708091}.rn-recurrence-list-demo i.is-ready{background:#DDF7EF;color:#16866D}

/* Tasks and notices — equal-height primary columns mirror the real agenda UX. */
.rn-tasks-demo { overflow:hidden; }.rn-task-attention-demo{align-self:center;padding:6px 10px;border-radius:999px;background:#FFF0DE;color:#9B6418;font:700 8px var(--rn-font-ui)}.rn-task-attention-demo b{margin-right:3px;color:#9B6418;font-size:11px}
.rn-task-chips-demo{display:flex;gap:6px;flex-wrap:wrap;padding:13px 18px;background:#fff;border-bottom:1px solid #E4EAF0;font-family:var(--rn-font-ui)}.rn-task-chips-demo span{padding:5px 8px;border:1px solid #DEE6EB;border-radius:999px;color:#63758A;font-size:7px}.rn-task-chips-demo span.is-active{border-color:#A7C7FF;background:#EAF3FF;color:#0166FF;font-weight:800}
.rn-task-columns-demo{display:grid;grid-template-columns:repeat(3,1fr);align-items:stretch;gap:10px;padding:16px;background:#F5F8FA;font-family:var(--rn-font-ui)}.rn-task-columns-demo article{display:flex;flex-direction:column;min-height:270px;padding:13px;border:1px solid #E0E7EC;border-radius:12px;background:#fff}.rn-task-columns-demo article.is-overdue{border-color:#F0C8C2;background:#FFFBFA}.rn-task-columns-demo header{display:flex;justify-content:space-between;align-items:center;padding-bottom:11px;border-bottom:1px solid #E7ECEF}.rn-task-columns-demo header span{color:var(--rn-ink);font-size:10px;font-weight:800}.rn-task-columns-demo header b{display:grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#EDF3F7;color:var(--rn-ink);font-size:8px}.rn-task-columns-demo article.is-overdue header b{background:#FCE7E4;color:#AE443B}
.rn-task-columns-demo article > div{position:relative;margin-top:10px;padding:10px;border:1px solid #E6ECEF;border-radius:9px;background:#fff}.rn-task-columns-demo article > div small,.rn-task-columns-demo article > div strong,.rn-task-columns-demo article > div span,.rn-task-columns-demo article > div em{display:block}.rn-task-columns-demo article > div small{color:#0166FF;font-size:6px;font-weight:800;letter-spacing:.07em}.rn-task-columns-demo article > div strong{margin-top:2px;color:var(--rn-ink);font-size:9px}.rn-task-columns-demo article > div span{margin-top:2px;color:#778698;font-size:7px}.rn-task-columns-demo article > div em{margin-top:7px;color:#8A6A33;font-size:6px;font-style:normal;font-weight:700}

@media (max-width: 1080px) {
    .rn-capability-layout--reverse { grid-template-columns:1fr; gap:58px; }
    .rn-capability-layout--reverse .rn-capability-copy,
    .rn-capability-layout--reverse .rn-real-surface { order:initial; }
    .rn-memory-demo { max-width:820px; }
    .rn-tax-callouts { max-width:720px; }
}

@media (max-width: 760px) {
    .rn-designer-demo-grid { grid-template-columns:1fr; }
    .rn-designer-demo-controls { border-right:0; border-bottom:1px solid #E4EAF0; }
    .rn-design-paper { min-height:330px; }
    .rn-memory-demo { grid-template-columns:1fr; }
    .rn-tax-callouts > span { grid-template-columns:1fr; gap:3px; }
    .rn-tax-customer-demo { align-items:flex-start; flex-direction:column; }
    .rn-tax-table-demo > div { grid-template-columns:1fr 58px 75px; gap:8px; }
    .rn-tax-summary-demo { grid-template-columns:1fr 1fr; }
    .rn-tax-summary-demo span:nth-child(3) { border-left:0; border-top:1px solid #DDE5EB; }
    .rn-tax-summary-demo span:nth-child(4) { border-top:1px solid #DDE5EB; }
    .rn-collection-kpis-demo { grid-template-columns:1fr 1fr; }
    .rn-collection-kpis-demo > span:nth-child(3) { border-left:0; border-top:1px solid #E7ECEF; }
    .rn-collection-kpis-demo > span:nth-child(4) { border-top:1px solid #E7ECEF; }
    .rn-aging-demo > div { grid-template-columns:86px 1fr 68px; }
    .rn-sepa-kpis-demo, .rn-recurrence-kpis-demo { grid-template-columns:1fr 1fr; }
    .rn-sepa-kpis-demo > span:nth-child(3), .rn-recurrence-kpis-demo > span:nth-child(3) { grid-column:1/-1; border-left:0; border-top:1px solid #E7ECEF; }
    .rn-recurrence-list-demo { overflow-x:auto; scrollbar-width:thin; }
    .rn-recurrence-list-demo > div { min-width:620px; }
    .rn-task-columns-demo { grid-template-columns:1fr; }
    .rn-task-columns-demo article { min-height:0; }
}

@media (max-width: 480px) {
    .rn-layout-demo { grid-template-columns:1fr; }
    .rn-layout-demo i { display:none; }
    .rn-design-color-demo { grid-template-columns:1fr; }
    .rn-designer-demo-controls, .rn-designer-demo-preview { padding:17px; }
    .rn-memory-demo > article { padding:17px; }
    .rn-concept-list-demo > div { grid-template-columns:1fr auto; }.rn-concept-list-demo i{grid-column:1/-1;justify-self:start}
    .rn-tax-table-demo { padding-inline:13px; }.rn-tax-table-demo > div { grid-template-columns:1fr 52px 66px; padding-inline:2px; }
    .rn-tax-summary-demo { padding-inline:13px; }
    .rn-collection-list-demo { padding-inline:13px; }.rn-collection-list-demo > div{grid-template-columns:1fr auto}.rn-collection-list-demo > div > strong{grid-column:1/-1;justify-self:start}
    .rn-aging-demo { padding-inline:13px; }.rn-aging-demo > div{grid-template-columns:78px 1fr 60px;gap:7px}
    .rn-sepa-artifact-demo, .rn-sepa-draft-demo { align-items:flex-start; flex-direction:column; }
}

/* ================================================================
 * RAINNUM-WEB-01.1C.3 — Commercial Rhythm / Connected Business /
 * Advisor Delivery / Cockpit Finale.
 * Product story is complete enough to vary rhythm deliberately: compact
 * chapters, dark editorial interruptions, and the dense cockpit only after
 * the visitor has learned what its data means.
 * ================================================================ */

/* Post-setup rhythm: same product system, deliberately different chapter
 * heights so the commercial page stops feeling like an endless template. */
.rn-capability--design { padding: clamp(88px, 9vw, 124px) 0; }
.rn-capability--memory { padding: clamp(72px, 8vw, 108px) 0; }
.rn-capability--taxes { padding: clamp(110px, 12vw, 158px) 0; }
.rn-capability--collections { padding: clamp(94px, 10vw, 136px) 0; }
.rn-capability--sepa { padding: clamp(72px, 8vw, 104px) 0; }
.rn-capability--recurrences { padding: clamp(96px, 10vw, 138px) 0; }
.rn-capability--tasks { padding: clamp(112px, 12vw, 166px) 0; }

/* Motivational bridge after setup: a short emotional chapter, not another
 * product panel. */
.rn-emotional-band {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: clamp(430px, 52svh, 610px);
    display: grid;
    align-items: center;
    background: var(--rn-ink);
    color: #fff;
}
.rn-emotional-band::before,
.rn-emotional-band::after {
    content: "";
    position: absolute;
    pointer-events: none;
    border-radius: 50%;
    filter: blur(120px);
}
.rn-emotional-band::before { width: 430px; height: 430px; right: 12%; top: -38%; background: rgba(1,102,255,.26); }
.rn-emotional-band::after { width: 300px; height: 300px; left: 12%; bottom: -46%; background: rgba(87,214,195,.16); }
.rn-emotional-band-inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .8fr) minmax(180px, .2fr); gap: clamp(45px, 10vw, 150px); align-items: center; }
.rn-emotional-band h2,
.rn-connections-heading h2,
.rn-cockpit-finale-heading h2,
.rn-closing-story h2 {
    margin: 0;
    font-family: "Nexa Heavy", "Nexa Bold", "Nexa", "Avenir Next", Montserrat, Arial, sans-serif;
    font-weight: 900;
    letter-spacing: -.055em;
    text-wrap: balance;
}
.rn-emotional-band h2 { max-width: 740px; color: #fff; font-size: clamp(36px, 4vw, 52px); line-height: .98; }
.rn-emotional-band p:not(.rn-story-eyebrow) { max-width: 710px; margin: 25px 0 0; color: #B7C6D6; font: 17px/1.65 var(--rn-font-ui); }
.rn-emotional-thread { position: relative; justify-self: end; width: 150px; height: 260px; }
.rn-emotional-thread > span { position: absolute; top: 0; left: 50%; width: 1px; height: 205px; background: linear-gradient(180deg, rgba(112,167,255,.05), rgba(112,167,255,.72)); }
.rn-emotional-thread i { position: absolute; left: calc(50% - 8px); width: 16px; height: 20px; border-radius: 55% 55% 60% 60% / 38% 38% 68% 68%; background: var(--rn-aqua); transform: rotate(45deg); box-shadow: 0 0 30px rgba(87,214,195,.28); }
.rn-emotional-thread i:nth-child(2) { top: 195px; }
.rn-emotional-thread i:nth-child(3) { top: 235px; left: calc(50% + 32px); width: 8px; height: 11px; opacity: .45; }

/* Connected business: a deliberate dark interruption with WooCommerce as the
 * strongest proven commercial story, then the hotel connectors as context. */
.rn-connections-story {
    position: relative;
    overflow: hidden;
    padding: clamp(130px, 14vw, 195px) 0 clamp(120px, 13vw, 180px);
    background: linear-gradient(180deg, #001634 0%, #061B38 100%);
    color: #fff;
}
.rn-connections-story::before { content:""; position:absolute; width:620px; height:620px; right:-150px; top:24%; border-radius:50%; background:rgba(1,102,255,.16); filter:blur(135px); pointer-events:none; }
.rn-connections-story::after { content:""; position:absolute; width:460px; height:460px; left:-130px; bottom:-120px; border-radius:50%; background:rgba(87,214,195,.11); filter:blur(130px); pointer-events:none; }
.rn-connections-story .rn-container { position:relative; z-index:1; }
.rn-connections-heading { max-width: 860px; margin-bottom: clamp(68px, 8vw, 110px); }
.rn-connections-heading h2 { max-width:760px; color:#fff; font-size:clamp(38px,4vw,52px); line-height:.99; }
.rn-connections-heading > p:not(.rn-story-eyebrow) { max-width:720px; margin:26px 0 0; color:#B9C8D8; font:17px/1.65 var(--rn-font-ui); }
.rn-woo-story { display:grid; grid-template-columns:minmax(280px,.62fr) minmax(0,1.38fr); gap:clamp(50px,7vw,96px); align-items:center; }
.rn-woo-copy h3 { max-width:480px; margin:19px 0 0; color:#fff; font:900 clamp(34px,3.5vw,47px)/.98 var(--rn-font-heavy); letter-spacing:-.05em; text-wrap:balance; }
.rn-woo-copy > p { max-width:490px; margin:23px 0 0; color:#B3C2D2; font:16px/1.62 var(--rn-font-ui); }
.rn-connector-badge { display:inline-flex; align-items:center; gap:8px; padding:7px 10px; border:1px solid rgba(255,255,255,.11); border-radius:999px; color:#D7E1EB; background:rgba(255,255,255,.05); font:800 10px var(--rn-font-ui); letter-spacing:.04em; }
.rn-connector-badge i { width:8px; height:8px; border-radius:50%; background:var(--rn-aqua); box-shadow:0 0 0 5px rgba(87,214,195,.10); }
.rn-dark-benefits--compact { margin-top:30px; }
.rn-dark-benefits--compact article { padding:14px 0; }
.rn-woo-demo { position:relative; overflow:hidden; padding:28px; border:1px solid rgba(255,255,255,.11); border-radius:26px; background:rgba(16,40,70,.78); box-shadow:0 40px 90px rgba(0,0,0,.27); backdrop-filter:blur(10px); font-family:var(--rn-font-ui); }
.rn-woo-demo-head { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; }
.rn-woo-demo-head > div { display:grid; gap:2px; }
.rn-woo-demo-head span { color:#7FA7DA; font-size:8px; font-weight:800; }
.rn-woo-demo-head strong { color:#fff; font-size:20px; line-height:1.1; }
.rn-woo-demo-head small { color:#94A8BB; font-size:8px; }
.rn-woo-demo-head em { padding:6px 9px; border-radius:999px; background:rgba(87,214,195,.13); color:#83E4D5; font-size:7px; font-style:normal; font-weight:850; }
.rn-woo-frozen-demo { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; margin-top:19px; padding:14px; border:1px solid rgba(112,167,255,.20); border-radius:12px; background:rgba(1,102,255,.08); }
.rn-woo-frozen-demo > div { display:grid; gap:2px; }
.rn-woo-frozen-demo strong { color:#fff; font-size:11px; }
.rn-woo-frozen-demo small { color:#9FB0C2; font-size:7.5px; line-height:1.45; }
.rn-woo-frozen-demo > span { display:inline-flex; align-items:center; gap:5px; flex:0 0 auto; padding:5px 7px; border-radius:999px; background:rgba(255,255,255,.06); color:#CFE1F4; font-size:7px; font-weight:800; }
.rn-woo-frozen-demo > span i { width:6px; height:6px; border-radius:50%; background:var(--rn-aqua); }
.rn-woo-demo-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:12px; }
.rn-woo-demo-grid article { padding:11px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:rgba(255,255,255,.045); }
.rn-woo-demo-grid span,.rn-woo-demo-grid strong,.rn-woo-demo-grid small { display:block; }
.rn-woo-demo-grid span { color:#8096AE; font-size:7px; font-weight:800; }
.rn-woo-demo-grid strong { margin-top:2px; color:#fff; font-size:9px; }
.rn-woo-demo-grid small { margin-top:2px; color:#93A6BA; font-size:7px; }
.rn-woo-lines-demo { margin-top:12px; padding:0 11px; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:rgba(255,255,255,.035); }
.rn-woo-lines-demo > div { display:grid; grid-template-columns:1fr 55px 82px; gap:10px; align-items:center; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.07); }
.rn-woo-lines-demo > div:last-child { border-bottom:0; }
.rn-woo-lines-demo .is-head { color:#7189A1; font-size:6.5px; text-transform:uppercase; letter-spacing:.08em; }
.rn-woo-lines-demo span b,.rn-woo-lines-demo span small { display:block; }
.rn-woo-lines-demo span b { color:#EAF1F7; font-size:8px; }
.rn-woo-lines-demo span small { color:#879CB0; font-size:6.5px; }
.rn-woo-lines-demo em { justify-self:start; padding:3px 6px; border-radius:999px; background:rgba(112,167,255,.11); color:#85B3FF; font-size:7px; font-style:normal; font-weight:800; }
.rn-woo-lines-demo strong { justify-self:end; color:#fff; font-size:8px; }
.rn-woo-origin-demo,.rn-woo-total-demo { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-top:12px; padding:11px 12px; border-radius:10px; background:rgba(255,255,255,.045); }
.rn-woo-origin-demo span,.rn-woo-origin-demo strong { display:block; }
.rn-woo-origin-demo span { color:#7F96AC; font-size:7px; }
.rn-woo-origin-demo strong { margin-top:2px; color:#E9F0F7; font-size:8px; }
.rn-woo-origin-demo em { padding:4px 7px; border-radius:999px; background:rgba(255,255,255,.07); color:#C7D4E1; font-size:7px; font-style:normal; }
.rn-woo-total-demo { margin-top:8px; border-top:1px solid rgba(255,255,255,.08); background:transparent; color:#A4B4C4; font-size:8px; }
.rn-woo-total-demo strong { color:#fff; font-size:15px; }
.rn-connector-bridge { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:clamp(75px,8vw,105px); }
.rn-connector-bridge article { min-width:0; padding:24px; border:1px solid rgba(255,255,255,.10); border-radius:18px; background:rgba(255,255,255,.04); font-family:var(--rn-font-ui); }
.rn-connector-bridge article.is-ready { border-color:rgba(87,214,195,.26); background:linear-gradient(145deg,rgba(87,214,195,.08),rgba(255,255,255,.035)); }
.rn-connector-symbol { display:grid; place-items:center; width:37px; height:37px; margin-bottom:18px; border-radius:12px; background:rgba(112,167,255,.13); color:#87B4FF; font-size:12px; font-weight:900; }
.rn-connector-bridge .is-ready .rn-connector-symbol { background:rgba(87,214,195,.13); color:#8AE5D7; }
.rn-connector-bridge article > span { color:#7791AD; font-size:8px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.rn-connector-bridge h3 { margin:5px 0 0; color:#fff; font:900 20px/1.05 var(--rn-font-heavy); letter-spacing:-.035em; }
.rn-connector-bridge p { min-height:66px; margin:11px 0 18px; color:#9FB0C2; font-size:11px; line-height:1.5; }
.rn-connector-bridge em { display:inline-flex; align-items:center; gap:6px; color:#8097AE; font-size:8px; font-style:normal; }
.rn-connector-bridge em i { width:7px; height:7px; border-radius:50%; background:var(--rn-aqua); }
.rn-connections-safe-note { max-width:700px; margin:23px auto 0; color:#7F94AA; text-align:center; font:10px/1.5 var(--rn-font-ui); }

/* Advisor delivery: real, calm, and operational. */
.rn-advisor-story { padding:clamp(105px,11vw,155px) 0; background:#F5F8FA; }
.rn-advisor-layout { display:grid; grid-template-columns:minmax(290px,.68fr) minmax(0,1.32fr); gap:clamp(50px,7vw,100px); align-items:center; }
.rn-advisor-demo { position:relative; min-width:0; }
.rn-atmosphere--advisor-a { width:380px; height:380px; top:-65px; right:-35px; background:rgba(87,214,195,.22); filter:blur(118px); }
.rn-advisor-app-demo { position:relative; overflow:hidden; }
.rn-advisor-filters-demo { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; padding:17px 18px; background:#fff; border-bottom:1px solid #E3E9ED; font-family:var(--rn-font-ui); }
.rn-advisor-filters-demo label { padding:10px; border:1px solid #E1E8ED; border-radius:9px; background:#FCFDFE; }
.rn-advisor-filters-demo span,.rn-advisor-filters-demo b { display:block; }
.rn-advisor-filters-demo span { color:#7A899A; font-size:7px; }
.rn-advisor-filters-demo b { margin-top:2px; color:var(--rn-ink); font-size:9px; }
.rn-advisor-ready-demo { display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:center; margin:16px 18px 0; padding:14px; border:1px solid #CDE9E3; border-radius:12px; background:#F0FAF7; font-family:var(--rn-font-ui); }
.rn-advisor-ready-demo > span { padding:5px 7px; border-radius:999px; background:#D5F4EB; color:#167E68; font-size:7px; font-weight:850; }
.rn-advisor-ready-demo strong,.rn-advisor-ready-demo small,.rn-advisor-ready-demo code { display:block; }
.rn-advisor-ready-demo strong { color:var(--rn-ink); font-size:10px; }
.rn-advisor-ready-demo small { color:#667D78; font-size:7px; }
.rn-advisor-ready-demo code { margin-top:3px; color:#71877F; font-size:6.5px; }
.rn-advisor-actions-demo { display:flex; gap:6px; }
.rn-advisor-actions-demo em,.rn-advisor-actions-demo b { padding:7px 9px; border-radius:7px; font-size:7px; font-style:normal; white-space:nowrap; }
.rn-advisor-actions-demo em { border:1px solid #D6E0E6; background:#fff; color:#40546A; }
.rn-advisor-actions-demo b { background:var(--rn-ink); color:#fff; }
.rn-advisor-history-demo { margin:13px 18px 0; padding:0 12px; border:1px solid #E1E8ED; border-radius:11px; background:#fff; font-family:var(--rn-font-ui); }
.rn-advisor-history-demo > div { display:grid; grid-template-columns:1fr 150px 75px; gap:10px; align-items:center; padding:10px 0; border-bottom:1px solid #E8EDF0; }
.rn-advisor-history-demo > div:last-child { border-bottom:0; }
.rn-advisor-history-demo .is-head { color:#8190A0; font-size:6.5px; text-transform:uppercase; letter-spacing:.07em; }
.rn-advisor-history-demo span b,.rn-advisor-history-demo span small { display:block; }
.rn-advisor-history-demo span b { color:var(--rn-ink); font-size:8px; }
.rn-advisor-history-demo span small { color:#7B8A99; font-size:6.5px; }
.rn-advisor-history-demo em { color:#607287; font-size:7px; font-style:normal; }
.rn-advisor-history-demo strong { justify-self:start; padding:4px 6px; border-radius:999px; background:#DDF7EF; color:#16866D; font-size:6.5px; }
.rn-advisor-safety-demo { display:flex; gap:8px; align-items:flex-start; margin:13px 18px 18px; padding:10px 11px; border-left:3px solid var(--rn-aqua); border-radius:8px; background:#F4FBF9; color:#536F68; font:7.5px/1.45 var(--rn-font-ui); }
.rn-advisor-safety-demo i { color:#16866D; font-style:normal; font-weight:900; }

/* Cockpit appears only after the product has been explained: dense by design,
 * now perceived as the summary/reward rather than the first thing to learn. */
.rn-cockpit-finale { position:relative; overflow:hidden; padding:clamp(120px,13vw,185px) 0; background:#EEF5FA; }
.rn-cockpit-finale-heading { max-width:850px; margin:0 auto clamp(60px,7vw,95px); text-align:center; }
.rn-cockpit-finale-heading h2 { color:var(--rn-ink); font-size:clamp(38px,4vw,52px); line-height:.99; }
.rn-cockpit-finale-heading > p:not(.rn-story-eyebrow) { max-width:760px; margin:24px auto 0; color:#5B6D83; font:16px/1.62 var(--rn-font-ui); }
.rn-cockpit-demo { position:relative; max-width:1120px; margin:0 auto; padding:26px; border:1px solid #DCE5EA; border-radius:28px; background:#fff; box-shadow:0 38px 90px rgba(0,22,52,.12); font-family:var(--rn-font-ui); }
.rn-atmosphere--cockpit-a { width:520px; height:520px; right:-80px; top:-160px; background:rgba(1,102,255,.12); filter:blur(135px); }
.rn-cockpit-demo > *:not(.rn-atmosphere) { position:relative; }
.rn-cockpit-demo-head { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; padding-bottom:18px; border-bottom:1px solid #E2E8EC; }
.rn-cockpit-demo-head > div { display:grid; gap:3px; }
.rn-cockpit-demo-head strong { color:var(--rn-ink); font:900 21px/1.08 var(--rn-font-heavy); letter-spacing:-.035em; }
.rn-cockpit-demo-head small { color:#718195; font-size:9px; }
.rn-cockpit-demo-head em { display:inline-flex; align-items:center; gap:6px; padding:6px 9px; border-radius:999px; background:#EFF9F5; color:#33776A; font-size:7px; font-style:normal; font-weight:750; }
.rn-cockpit-demo-head em i { width:6px; height:6px; border-radius:50%; background:var(--rn-aqua); }
.rn-cockpit-period-demo { display:flex; align-items:center; gap:7px; padding:14px 0; }
.rn-cockpit-period-demo span { padding:5px 8px; border:1px solid #E0E7EC; border-radius:999px; color:#6A7B8F; font-size:7px; }
.rn-cockpit-period-demo span.is-active { border-color:#AAC9FF; background:#EAF3FF; color:#0166FF; font-weight:800; }
.rn-cockpit-period-demo strong { margin-left:auto; color:#6A7B8F; font-size:8px; }
.rn-cockpit-kpis-demo { display:grid; grid-template-columns:repeat(6,1fr); gap:7px; }
.rn-cockpit-kpis-demo article { min-width:0; padding:12px; border:1px solid #E4EAEF; border-radius:11px; background:#FAFCFD; }
.rn-cockpit-kpis-demo article.is-alert { background:#FFF8F5; border-color:#F3D9D2; }
.rn-cockpit-kpis-demo article.is-good { background:#F2FAF7; border-color:#D4EEE6; }
.rn-cockpit-kpis-demo span,.rn-cockpit-kpis-demo strong,.rn-cockpit-kpis-demo small { display:block; }
.rn-cockpit-kpis-demo span { color:#718195; font-size:6.5px; font-weight:750; }
.rn-cockpit-kpis-demo strong { margin-top:5px; color:var(--rn-ink); font-size:13px; letter-spacing:-.025em; }
.rn-cockpit-kpis-demo small { margin-top:2px; color:#8A97A5; font-size:6px; line-height:1.35; }
.rn-cockpit-insight-demo { display:grid; grid-template-columns:minmax(190px,.32fr) 1fr; gap:18px; align-items:center; margin-top:13px; padding:13px 15px; border-radius:11px; background:#F5F8FA; }
.rn-cockpit-insight-demo > div { display:flex; align-items:center; gap:8px; }
.rn-cockpit-insight-demo > div span { width:8px; height:8px; border-radius:50%; background:#F0B45F; }
.rn-cockpit-insight-demo strong { color:var(--rn-ink); font-size:8px; }
.rn-cockpit-insight-demo p { margin:0; color:#627489; font-size:7.5px; line-height:1.45; }
.rn-cockpit-main-demo { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr); gap:10px; margin-top:10px; }
.rn-cockpit-main-demo > article { min-width:0; padding:15px; border:1px solid #E1E8ED; border-radius:13px; background:#fff; }
.rn-cockpit-main-demo header { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }
.rn-cockpit-main-demo header span,.rn-cockpit-main-demo header strong { display:block; }
.rn-cockpit-main-demo header span { color:#7B8B9C; font-size:6.5px; text-transform:uppercase; letter-spacing:.06em; }
.rn-cockpit-main-demo header strong { margin-top:2px; color:var(--rn-ink); font-size:10px; }
.rn-cockpit-main-demo header > b { color:var(--rn-ink); font-size:11px; }
.rn-cockpit-chart-lines { height:125px; margin-top:17px; }
.rn-cockpit-chart-lines svg { width:100%; height:100%; overflow:visible; }
.rn-cockpit-chart-lines .area { fill:rgba(1,102,255,.08); }
.rn-cockpit-chart-lines .line { fill:none; stroke:#0166FF; stroke-width:2; vector-effect:non-scaling-stroke; }
.rn-cockpit-chart-labels { display:grid; grid-template-columns:repeat(5,1fr); gap:4px; margin-top:5px; }
.rn-cockpit-chart-labels span { text-align:center; }
.rn-cockpit-chart-labels b,.rn-cockpit-chart-labels small { display:block; }
.rn-cockpit-chart-labels b { color:#607288; font-size:6.5px; }
.rn-cockpit-chart-labels small { color:#8C98A6; font-size:6px; }
.rn-cockpit-agenda-demo header > b { display:grid; place-items:center; min-width:24px; height:24px; border-radius:999px; background:#FFF0DE; color:#9C6417; font-size:8px; }
.rn-cockpit-agenda-counts { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-top:14px; }
.rn-cockpit-agenda-counts span { padding:9px; border-radius:9px; background:#F5F8FA; text-align:center; }
.rn-cockpit-agenda-counts strong,.rn-cockpit-agenda-counts small { display:block; }
.rn-cockpit-agenda-counts strong { color:var(--rn-ink); font-size:12px; }
.rn-cockpit-agenda-counts small { color:#7B899A; font-size:6px; }
.rn-cockpit-agenda-item { display:grid; grid-template-columns:7px 1fr auto; gap:8px; align-items:center; margin-top:8px; padding:9px; border:1px solid #E5EBEF; border-radius:9px; }
.rn-cockpit-agenda-item > i { width:7px; height:7px; border-radius:50%; background:#0166FF; }
.rn-cockpit-agenda-item strong,.rn-cockpit-agenda-item small { display:block; }
.rn-cockpit-agenda-item strong { color:var(--rn-ink); font-size:7.5px; }
.rn-cockpit-agenda-item small { color:#7B899A; font-size:6px; }
.rn-cockpit-agenda-item em { color:#9A6C24; font-size:6px; font-style:normal; font-weight:750; }

/* Closing statement base; WEB-01.1D adds the real conversion surface below. */
.rn-closing-story { position:relative; overflow:hidden; min-height:clamp(500px,64svh,720px); display:grid; align-items:center; background:linear-gradient(180deg,#001634 0%,#032756 58%,#0166FF 145%); color:#fff; }
.rn-closing-story::before { content:""; position:absolute; width:560px; height:560px; left:50%; top:54%; transform:translate(-50%,-50%); border-radius:50%; background:rgba(1,102,255,.18); filter:blur(145px); }
.rn-closing-story-inner { position:relative; z-index:1; max-width:900px; text-align:center; }
.rn-closing-story h2 { max-width:860px; margin-inline:auto; color:#fff; font-size:clamp(38px,4.3vw,56px); line-height:.98; }
.rn-closing-story p:not(.rn-story-eyebrow) { max-width:700px; margin:25px auto 0; color:#B7C7D7; font:16px/1.62 var(--rn-font-ui); }
.rn-closing-drops { position:relative; width:260px; height:72px; margin:45px auto 0; }
.rn-closing-drops i { position:absolute; width:9px; height:12px; border-radius:55% 55% 60% 60% / 38% 38% 68% 68%; background:var(--rn-aqua); transform:rotate(45deg); opacity:.72; }
.rn-closing-drops i:nth-child(1){left:7%;top:15px}.rn-closing-drops i:nth-child(2){left:28%;top:37px;width:6px;height:8px;opacity:.38}.rn-closing-drops i:nth-child(3){left:50%;top:5px;width:12px;height:16px}.rn-closing-drops i:nth-child(4){left:71%;top:30px;width:7px;height:10px;opacity:.48}.rn-closing-drops i:nth-child(5){left:91%;top:12px;width:8px;height:11px}

/* The closing statement already provides the last large pause. */
.rn-closing-story + .rn-site-footer--landing { padding-top: 54px; }

@media (max-width: 1080px) {
    .rn-woo-story,
    .rn-advisor-layout { grid-template-columns:1fr; gap:56px; }
    .rn-woo-copy { max-width:760px; }
    .rn-connector-bridge { grid-template-columns:1fr 1fr; }
    .rn-connector-bridge article:last-child { grid-column:1/-1; }
    .rn-cockpit-kpis-demo { grid-template-columns:repeat(3,1fr); }
}

@media (max-width: 760px) {
    .rn-emotional-band { min-height:430px; }
    .rn-emotional-band-inner { grid-template-columns:1fr; gap:20px; }
    .rn-emotional-thread { display:none; }
    .rn-connections-story { padding:100px 0; }
    .rn-connections-heading { margin-bottom:60px; }
    .rn-woo-demo { padding:18px; border-radius:20px; }
    .rn-woo-demo-grid { grid-template-columns:1fr; }
    .rn-woo-lines-demo > div { grid-template-columns:1fr 48px 70px; gap:7px; }
    .rn-connector-bridge { grid-template-columns:1fr; }
    .rn-connector-bridge article:last-child { grid-column:auto; }
    .rn-connector-bridge p { min-height:0; }
    .rn-advisor-story { padding:90px 0; }
    .rn-advisor-filters-demo { grid-template-columns:1fr 1fr; }
    .rn-advisor-ready-demo { grid-template-columns:1fr; }
    .rn-advisor-actions-demo { justify-content:flex-start; flex-wrap:wrap; }
    .rn-advisor-history-demo { overflow-x:auto; scrollbar-width:thin; }
    .rn-advisor-history-demo > div { min-width:540px; }
    .rn-cockpit-finale { padding:100px 0; }
    .rn-cockpit-demo { padding:17px; border-radius:21px; }
    .rn-cockpit-demo-head { flex-direction:column; }
    .rn-cockpit-period-demo { flex-wrap:wrap; }
    .rn-cockpit-period-demo strong { width:100%; margin:4px 0 0; }
    .rn-cockpit-kpis-demo { grid-template-columns:1fr 1fr; }
    .rn-cockpit-insight-demo { grid-template-columns:1fr; gap:7px; }
    .rn-cockpit-main-demo { grid-template-columns:1fr; }
    .rn-closing-story { min-height:520px; }
}

@media (max-width: 480px) {
    .rn-woo-demo-head { flex-direction:column; }
    .rn-woo-lines-demo > div { grid-template-columns:1fr auto; }
    .rn-woo-lines-demo > div > strong { grid-column:1/-1; justify-self:start; }
    .rn-woo-lines-demo .is-head { display:none; }
    .rn-woo-origin-demo { align-items:flex-start; flex-direction:column; }
    .rn-advisor-filters-demo { grid-template-columns:1fr; }
    .rn-cockpit-kpis-demo { grid-template-columns:1fr; }
    .rn-cockpit-chart-labels small { display:none; }
}

/* ================================================================
 * RAINNUM-WEB-01.1C.4 — Editorial Rhythm / Floating Interlude /
 * Brand Motion / Dark Footer Closure.
 * Functional product stories stay unchanged; this layer only adds rhythm,
 * a restrained Rainnum motion language and a final dark brand closure.
 * ================================================================ */
.rn-main--landing { position: relative; }

/* Five tiny Rainnum drops act as a very light long-form visual thread. They
 * live in the page margins, never carry navigation and never block content. */
.rn-page-rain {
    position: absolute;
    inset: 0;
    z-index: 7;
    overflow: hidden;
    pointer-events: none;
}
.rn-guide-drop {
    --rn-scroll-drift: 0px;
    position: absolute;
    width: 32px;
    height: 36px;
    transform: translate3d(0, var(--rn-scroll-drift), 0);
    opacity: .34;
    will-change: transform;
}
.rn-guide-drop::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 5px;
    width: 17px;
    height: 22px;
    border-radius: 58% 58% 62% 62% / 40% 40% 70% 70%;
    background: linear-gradient(145deg, rgba(87,214,195,.92), rgba(1,102,255,.70));
    box-shadow: 0 8px 24px rgba(1,102,255,.10);
    transform: rotate(45deg);
}
.rn-guide-drop i {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: rgba(0,22,52,.72);
    font: 800 7px/1 var(--rn-font-ui);
    font-style: normal;
    transform: translateY(-1px);
}
.rn-guide-drop--1 { top: 17.5%; left: max(12px, calc(50% - 655px)); }
.rn-guide-drop--2 { top: 34%; right: max(12px, calc(50% - 660px)); opacity:.22; }
.rn-guide-drop--3 { top: 50.5%; left: max(14px, calc(50% - 670px)); opacity:.26; }
.rn-guide-drop--4 { top: 69%; right: max(14px, calc(50% - 665px)); opacity:.20; }
.rn-guide-drop--5 { top: 86%; left: max(16px, calc(50% - 650px)); opacity:.30; }

/* Editorial interruption between fiscal depth and collections. The card floats
 * across the light canvases instead of becoming another full-width band. */
.rn-floating-interlude {
    position: relative;
    z-index: 9;
    padding: 0 0 clamp(45px, 5vw, 72px);
    background: linear-gradient(180deg, #EEF5FA 0 42%, #F5F8FA 42% 100%);
}
.rn-floating-interlude-card {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    width: min(88%, 1040px);
    min-height: 330px;
    margin: 0 auto;
    padding: clamp(42px, 5vw, 68px);
    border: 1px solid rgba(125, 180, 252, .18);
    border-radius: 34px;
    background: linear-gradient(135deg, #001634 0%, #062450 62%, #07346D 100%);
    box-shadow: 0 36px 90px rgba(0,22,52,.18);
    color: #fff;
}
.rn-floating-interlude-copy { position: relative; z-index: 3; max-width: 700px; }
.rn-floating-interlude h2 {
    max-width: 720px;
    margin: 0;
    color: #fff;
    font-family: var(--rn-font-heavy);
    font-size: clamp(34px, 4vw, 49px);
    font-weight: 900;
    line-height: .98;
    letter-spacing: -.045em;
    text-wrap: balance;
}
.rn-floating-interlude-copy > p:not(.rn-story-eyebrow) {
    max-width: 620px;
    margin: 22px 0 0;
    color: #BFD0DF;
    font: 15px/1.62 var(--rn-font-ui);
}
.rn-floating-glow {
    position: absolute;
    z-index: 0;
    display: block;
    border-radius: 50%;
    pointer-events: none;
}
.rn-floating-glow--a { width: 420px; height: 420px; right: -90px; top: -150px; background: rgba(1,102,255,.30); filter: blur(115px); }
.rn-floating-glow--b { width: 330px; height: 330px; left: 28%; bottom: -210px; background: rgba(87,214,195,.20); filter: blur(105px); }
.rn-floating-icon-family {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 10px;
    max-width: 620px;
    margin-top: 36px;
}
.rn-brand-glyph {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid rgba(185,215,240,.16);
    border-radius: 14px;
    background: rgba(255,255,255,.055);
    backdrop-filter: blur(7px);
    color: #DDEAF6;
}
.rn-brand-glyph svg {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.rn-brand-glyph svg circle { fill: var(--rn-aqua); stroke: none; }
.rn-brand-glyph small { overflow: hidden; text-overflow: ellipsis; color: #D4E0EC; font: 700 10px/1.2 var(--rn-font-ui); white-space: nowrap; }
.rn-floating-drop-trace { position:absolute; z-index:2; right:clamp(35px,8vw,110px); top:42px; width:82px; height:205px; opacity:.68; }
.rn-floating-drop-trace::before { content:""; position:absolute; left:40px; top:0; width:1px; height:155px; background:linear-gradient(180deg, transparent, rgba(87,214,195,.75)); }
.rn-floating-drop-trace i { position:absolute; width:9px; height:12px; border-radius:58% 58% 62% 62% / 40% 40% 70% 70%; background:var(--rn-aqua); transform:rotate(45deg); }
.rn-floating-drop-trace i:nth-child(1){left:36px;top:148px}.rn-floating-drop-trace i:nth-child(2){left:56px;top:178px;width:6px;height:8px;opacity:.52}.rn-floating-drop-trace i:nth-child(3){left:18px;top:190px;width:5px;height:7px;opacity:.34}

/* More editorial cadence in the long light middle chapter. */
.rn-capability--design { padding-top: clamp(92px, 9vw, 126px); padding-bottom: clamp(70px, 7vw, 100px); }
.rn-capability--memory { padding-top: clamp(72px, 7vw, 94px); padding-bottom: clamp(88px, 9vw, 122px); }
.rn-capability--taxes { padding-top: clamp(118px, 12vw, 166px); padding-bottom: clamp(128px, 13vw, 176px); }
.rn-capability--collections { padding-top: clamp(82px, 8vw, 112px); padding-bottom: clamp(98px, 10vw, 138px); }
.rn-capability--sepa { padding-top: clamp(70px, 7vw, 94px); padding-bottom: clamp(84px, 8vw, 112px); }
.rn-capability--recurrences { padding-top: clamp(106px, 11vw, 150px); padding-bottom: clamp(86px, 9vw, 120px); }
.rn-capability--tasks { padding-top: clamp(88px, 9vw, 122px); padding-bottom: clamp(116px, 12vw, 164px); }

/* Brand-motion foundation. Content is fully visible without JS. Only after the
 * tiny local script opts in do reveal transitions become active. */
.rn-motion-enabled [data-rn-reveal] {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
    transition:
        opacity 720ms cubic-bezier(.2,.7,.2,1) var(--rn-reveal-delay,0ms),
        transform 820ms cubic-bezier(.2,.7,.2,1) var(--rn-reveal-delay,0ms);
    will-change: opacity, transform;
}
.rn-motion-enabled [data-rn-reveal].is-visible { opacity: 1; transform: translate3d(0,0,0); }
.rn-motion-enabled .rn-real-surface[data-rn-reveal],
.rn-motion-enabled .rn-woo-demo[data-rn-reveal],
.rn-motion-enabled .rn-cockpit-demo[data-rn-reveal] { transform: translate3d(0,28px,0) scale(.992); }
.rn-motion-enabled .rn-real-surface[data-rn-reveal].is-visible,
.rn-motion-enabled .rn-woo-demo[data-rn-reveal].is-visible,
.rn-motion-enabled .rn-cockpit-demo[data-rn-reveal].is-visible { transform: translate3d(0,0,0) scale(1); }

.rn-motion-enabled .rn-journey-marker { transition: background-color .42s ease, border-color .42s ease, transform .5s cubic-bezier(.2,.8,.2,1); }
.rn-motion-enabled .rn-journey-list:not(.is-visible) .rn-journey-marker { transform: scale(.82); }
.rn-motion-enabled .rn-journey-list.is-visible .rn-journey-step:nth-child(2) .rn-journey-marker { transition-delay:70ms; }
.rn-motion-enabled .rn-journey-list.is-visible .rn-journey-step:nth-child(3) .rn-journey-marker { transition-delay:140ms; }
.rn-motion-enabled .rn-journey-list.is-visible .rn-journey-step:nth-child(4) .rn-journey-marker { transition-delay:210ms; }
.rn-motion-enabled .rn-journey-list.is-visible .rn-journey-step:nth-child(5) .rn-journey-marker { transition-delay:280ms; }
.rn-motion-enabled .rn-journey-list.is-visible .rn-journey-step:nth-child(6) .rn-journey-marker { transition-delay:350ms; }

.rn-motion-enabled .rn-cockpit-chart-lines .line { stroke-dasharray: 720; stroke-dashoffset: 720; }
.rn-motion-enabled .rn-cockpit-demo.is-chart-live .rn-cockpit-chart-lines .line { animation: rn-chart-draw 1.55s cubic-bezier(.2,.7,.2,1) .18s forwards; }
.rn-motion-enabled .rn-cockpit-demo.is-chart-live .rn-cockpit-chart-lines .area { animation: rn-area-breathe .95s ease .55s both; }

.rn-motion-enabled .rn-atmosphere { animation: rn-atmosphere-breathe 13s ease-in-out infinite alternate; }
.rn-motion-enabled .rn-guide-drop::before { animation: rn-drop-breathe 7.5s ease-in-out infinite alternate; }
.rn-motion-enabled .rn-guide-drop--2::before { animation-delay:-1.8s; animation-duration:9s; }
.rn-motion-enabled .rn-guide-drop--3::before { animation-delay:-3.4s; animation-duration:8.2s; }
.rn-motion-enabled .rn-guide-drop--4::before { animation-delay:-2.5s; animation-duration:10s; }
.rn-motion-enabled .rn-guide-drop--5::before { animation-delay:-5.2s; animation-duration:8.8s; }
.rn-motion-enabled .rn-floating-drop-trace i { animation: rn-drop-trace 4.8s ease-in-out infinite; }
.rn-motion-enabled .rn-floating-drop-trace i:nth-child(2){animation-delay:-1.6s}.rn-motion-enabled .rn-floating-drop-trace i:nth-child(3){animation-delay:-3.1s}
.rn-motion-enabled .rn-brand-glyph { transition: transform .3s ease, border-color .3s ease, background-color .3s ease; }
.rn-motion-enabled .rn-brand-glyph:hover { transform: translateY(-3px); border-color: rgba(87,214,195,.42); background: rgba(255,255,255,.085); }
.rn-motion-enabled .rn-connector-bridge article { transition: transform .34s ease, border-color .34s ease, background-color .34s ease; }
.rn-motion-enabled .rn-connector-bridge article:hover { transform: translateY(-4px); border-color: rgba(87,214,195,.34); }

@keyframes rn-chart-draw { to { stroke-dashoffset:0; } }
@keyframes rn-area-breathe { from { opacity:0; } to { opacity:1; } }
@keyframes rn-atmosphere-breathe { from { transform:translate3d(-5px,-3px,0) scale(.97); opacity:.72; } to { transform:translate3d(7px,5px,0) scale(1.04); opacity:1; } }
@keyframes rn-drop-breathe { from { transform:rotate(45deg) translate3d(-2px,-2px,0); } to { transform:rotate(45deg) translate3d(5px,7px,0); } }
@keyframes rn-drop-trace { 0%,100%{transform:rotate(45deg) translate3d(0,-4px,0);opacity:.32} 50%{transform:rotate(45deg) translate3d(4px,8px,0);opacity:.92} }

/* The final statement and footer now read as one dark closure, mirroring the
 * dark opening of the site instead of falling back to an administrative white. */
.rn-site-footer--landing {
    padding: 0 0 34px;
    background: #001634;
    color: #fff;
}
.rn-closing-story + .rn-site-footer--landing { padding-top: 0; }
.rn-footer-inner {
    min-height: 96px;
    padding-top: 24px;
    border-top-color: rgba(172,229,226,.17);
}
.rn-footer-brand--inverse { width: 154px; }
.rn-footer-brand-master {
    display: block;
    width: 100%;
    aspect-ratio: 11302.69 / 1711.74;
    background: linear-gradient(90deg, var(--rn-aqua-master) 0 11.2%, #fff 11.2% 100%);
    -webkit-mask: url("../images/Logo_Rainnum.svg") center / contain no-repeat;
    mask: url("../images/Logo_Rainnum.svg") center / contain no-repeat;
}
.rn-footer-inner p { color: #AFC0D0; }
.rn-footer-inner p span { color: #8097AC; }

@media (max-width: 1180px) {
    .rn-page-rain { display:none; }
}

@media (max-width: 760px) {
    .rn-floating-interlude { padding-bottom:44px; }
    .rn-floating-interlude-card { width:100%; min-height:0; padding:38px 26px; border-radius:26px; }
    .rn-floating-interlude h2 { font-size:clamp(31px,9vw,42px); }
    .rn-floating-icon-family { grid-template-columns:1fr 1fr; max-width:none; }
    .rn-floating-drop-trace { right:18px; top:22px; opacity:.35; transform:scale(.8); transform-origin:top right; }
    .rn-footer-inner { min-height:112px; }
}

@media (max-width: 420px) {
    .rn-floating-icon-family { gap:7px; }
    .rn-brand-glyph { padding:9px; }
    .rn-brand-glyph small { font-size:9px; }
}

@media (prefers-reduced-motion: reduce) {
    .rn-page-rain { display:none !important; }
    .rn-motion-enabled [data-rn-reveal],
    .rn-motion-enabled [data-rn-reveal].is-visible { opacity:1 !important; transform:none !important; }
    .rn-motion-enabled .rn-atmosphere,
    .rn-motion-enabled .rn-guide-drop::before,
    .rn-motion-enabled .rn-floating-drop-trace i,
    .rn-motion-enabled .rn-cockpit-chart-lines .line,
    .rn-motion-enabled .rn-cockpit-chart-lines .area { animation:none !important; }
    .rn-motion-enabled .rn-cockpit-chart-lines .line { stroke-dashoffset:0 !important; }
}

/* ================================================================
 * RAINNUM-WEB-01.1C.5 — Living Product Story / Number Rain /
 * Interactive Journey / UI Microdemos.
 * The commercial story remains the same; this layer only makes real
 * capabilities easier to understand through restrained, viewport-bound motion.
 * ================================================================ */

/* RAINNUM-WEB-01.1C.5.1 — Number rain: organic gravity first, geometry second. The points begin as
 * weak blue rain from the storm above, settle into a number, then the very same
 * points fall away again. One or two drops survive a little longer to invite
 * the eye toward the next section. The no-JS / reduced-motion fallback is a
 * quiet blue dotted "1". */
.rn-story-intro-inner {
    grid-template-columns: minmax(0, 720px) minmax(260px, 1fr);
    align-items: center;
}
.rn-number-rain {
    position: relative;
    min-height: 410px;
    align-self: stretch;
    display: grid;
    place-items: center;
    overflow: visible;
}
.rn-number-rain-stage {
    position: relative;
    width: 270px;
    height: 360px;
    overflow: visible;
}
.rn-number-rain-stage::before {
    content: "";
    position: absolute;
    inset: 20px 8px 0;
    border-radius: 46%;
    background:
        radial-gradient(circle at 50% 36%, rgba(1,102,255,.08), rgba(68,151,255,.025) 42%, transparent 72%);
    filter: blur(22px);
    opacity: .82;
}
.rn-number-rain-dot {
    --rn-x: 0px;
    --rn-y: 0px;
    --rn-drop-size: 15px;
    position: absolute;
    z-index: 2;
    top: 46%;
    left: 50%;
    width: var(--rn-drop-size);
    height: var(--rn-drop-size);
    border-radius: 50%;
    background: #0166ff;
    box-shadow: 0 9px 25px rgba(1,102,255,.18);
    transform: translate(calc(-50% + var(--rn-x)), calc(-50% + var(--rn-y)));
    opacity: 0;
    will-change: transform, opacity;
}
/* Static fallback: restrained blue dotted 1. */
.rn-number-rain-dot:nth-child(1){--rn-x:0px;--rn-y:-72px;opacity:.82}
.rn-number-rain-dot:nth-child(2){--rn-x:-28px;--rn-y:-42px;opacity:.82}
.rn-number-rain-dot:nth-child(3){--rn-x:0px;--rn-y:-42px;opacity:.82}
.rn-number-rain-dot:nth-child(4){--rn-x:0px;--rn-y:-12px;opacity:.82}
.rn-number-rain-dot:nth-child(5){--rn-x:0px;--rn-y:18px;opacity:.82}
.rn-number-rain-dot:nth-child(6){--rn-x:-28px;--rn-y:48px;opacity:.82}
.rn-number-rain-dot:nth-child(7){--rn-x:0px;--rn-y:48px;opacity:.82}
.rn-number-rain-guide { display:none; }
.rn-motion-enabled .rn-number-rain-dot {
    opacity: 0;
    transition: none;
}
.rn-motion-enabled .rn-number-rain.is-settled .rn-number-rain-stage::before {
    opacity: 1;
}
/* Journey: perfect circles, smaller Heavy titles and a compact icon vocabulary.
 * It remains a story, not a row of buttons; hover is only an elegant response. */
.rn-journey-marker {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    transform: none;
    box-shadow: 0 0 0 7px var(--rn-ice);
}
.rn-journey-marker span { transform: none; font-size: 10px; }
.rn-journey-step--fiscal .rn-journey-marker { box-shadow: 0 0 0 7px var(--rn-ice), 0 13px 31px rgba(1,102,255,.13); }
.rn-journey-icon {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    margin: -6px 0 10px;
    color: #7A8CA1;
    transition: color .28s ease, transform .3s cubic-bezier(.2,.75,.2,1);
}
.rn-journey-icon svg { width: 23px; height: 23px; overflow: visible; }
.rn-journey-icon svg path,
.rn-journey-icon svg circle {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.rn-journey-step h3 {
    font-family: var(--rn-font-heavy);
    font-size: clamp(16px, 1.25vw, 19px);
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: -.02em;
}
.rn-journey-step--fiscal h3 { font-size: clamp(15px, 1.1vw, 17px); }
.rn-journey-step p { margin-top: 8px; font-size: 13px; }
.rn-motion-enabled .rn-journey-step:hover .rn-journey-marker {
    transform: scale(1.09);
    border-color: rgba(1,102,255,.5);
    box-shadow: 0 0 0 7px var(--rn-ice), 0 0 0 13px rgba(1,102,255,.075), 0 12px 32px rgba(1,102,255,.12);
}
.rn-motion-enabled .rn-journey-step:hover .rn-journey-icon { color: var(--rn-blue); transform: translateY(-2px); }
.rn-motion-enabled .rn-journey-step:last-child:hover .rn-journey-icon { color: #168C80; }

/* Invoice microdemo: a second real-looking concept enters and the paper preview
 * recalculates. Only synthetic values move; no product capability is invented. */
.rn-demo-line--added {
    max-height: 0;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
    border-color: transparent;
    opacity: 0;
    transform: translateY(-10px);
    transition: max-height .7s cubic-bezier(.2,.75,.2,1), margin .7s ease, padding .7s ease, opacity .38s ease, transform .6s ease, border-color .45s ease;
}
.rn-invoice-demo.is-demo-added .rn-demo-line--added {
    max-height: 170px;
    margin-top: 13px;
    padding-top: 14px;
    padding-bottom: 14px;
    border-color: #DEE6EB;
    opacity: 1;
    transform: translateY(0);
}
.rn-paper-demo-table--added {
    max-height: 0;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
    border-top: 0;
    opacity: 0;
    transform: translateY(-5px);
    transition: max-height .55s ease, padding .55s ease, opacity .35s ease, transform .55s ease;
}
.rn-invoice-demo.is-demo-added .rn-paper-demo-table--primary { border-bottom: 0; }
.rn-invoice-demo.is-demo-added .rn-paper-demo-table--added {
    max-height: 38px;
    padding: 8px 0;
    border-top: 1px solid #E0E6EA;
    opacity: 1;
    transform: none;
}
.rn-demo-add-button { transition: transform .22s ease, background-color .22s ease, border-color .22s ease, color .22s ease; }
.rn-invoice-demo.is-demo-added .rn-demo-add-button { transform: scale(.96); background: #EAF3FF; border-color: #BFD5FF; color: var(--rn-blue); }
[data-rn-invoice-base], [data-rn-invoice-vat], [data-rn-invoice-total], [data-rn-invoice-grand-total] { transition: color .24s ease, transform .28s ease; }
.rn-invoice-demo.is-demo-added [data-rn-invoice-total],
.rn-invoice-demo.is-demo-added [data-rn-invoice-grand-total] { color: var(--rn-blue); transform: scale(1.025); transform-origin: right center; }

/* Designer microdemo: logo scale, template selection and brand colour become a
 * slow, legible demonstration rather than a carousel. */
.rn-logo-demo-preview span,
.rn-layout-demo > span,
.rn-design-paper,
.rn-design-paper-logo span,
.rn-design-paper-meta,
.rn-design-paper-parties { transition: transform .55s cubic-bezier(.2,.75,.2,1), opacity .45s ease, background-color .45s ease, border-color .45s ease, color .45s ease; }
.rn-design-color-demo b em { color: inherit; font-style: normal; }
.rn-designer-demo.is-logo-large .rn-logo-demo-preview span { transform: scale(1.28); }
.rn-designer-demo.is-logo-large .rn-design-paper-logo span { transform: scale(1.24); transform-origin: left center; }
.rn-designer-demo.is-modern .rn-design-paper-meta { border-bottom-color: var(--rn-blue); }
.rn-designer-demo.is-modern .rn-design-paper { transform: translateY(-3px); }
.rn-designer-demo.is-minimal .rn-design-paper-parties { opacity:.38; transform: translateY(-3px); }
.rn-designer-demo.is-minimal .rn-design-paper-meta { border-bottom-width:1px; }
.rn-designer-demo.is-alt-color .rn-design-paper-logo span { background: var(--rn-blue); }
.rn-designer-demo.is-alt-color .rn-design-paper-meta { border-bottom-color: var(--rn-blue); }
.rn-designer-demo.is-alt-color .rn-design-color-demo i.is-ink { background: var(--rn-blue); }

/* Tareas: one incoming task is enough to communicate that the agenda is alive. */
.rn-task-demo-new {
    max-height: 0;
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden;
    border-color: transparent !important;
    opacity: 0;
    transform: translateY(-8px);
    transition: max-height .62s cubic-bezier(.2,.75,.2,1), margin .62s ease, padding .62s ease, opacity .38s ease, transform .55s ease, border-color .35s ease;
}
.rn-tasks-demo.is-new-task .rn-task-demo-new {
    max-height: 100px;
    margin-top: 10px !important;
    padding: 10px !important;
    border-color: #CFE0FB !important;
    opacity: 1;
    transform: translateY(0);
    box-shadow: 0 8px 22px rgba(1,102,255,.06);
}
.rn-task-attention-demo b,
[data-rn-task-next-count] { transition: transform .28s ease, color .28s ease; }
.rn-tasks-demo.is-new-task .rn-task-attention-demo b,
.rn-tasks-demo.is-new-task [data-rn-task-next-count] { transform: scale(1.16); color: var(--rn-blue); }

/* Cockpit: KPIs and chart alternate between two synthetic states while visible. */
.rn-chart-state { opacity: 0; transition: opacity .72s ease; }
.rn-chart-state.is-active { opacity: 1; }
.rn-cockpit-kpis-demo strong { transition: transform .3s ease, color .3s ease, opacity .24s ease; }
.rn-cockpit-kpis-demo strong.is-updating { transform: translateY(-2px) scale(1.035); color: var(--rn-blue); opacity:.72; }

@media (max-width: 980px) {
    .rn-story-intro-inner { grid-template-columns: minmax(0,1fr) 220px; gap: 40px; }
    .rn-number-rain-stage { transform: scale(.84); }
}
@media (max-width: 760px) {
    .rn-story-intro-inner { grid-template-columns: 1fr; }
    .rn-number-rain { min-height: 265px; margin-top: 4px; }
    .rn-number-rain-stage { height: 260px; transform: scale(.72); }
    .rn-journey-icon { margin-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .rn-number-rain-guide { display:none !important; }
    .rn-demo-line--added,
    .rn-paper-demo-table--added,
    .rn-task-demo-new { display:none !important; }
    .rn-journey-step:hover .rn-journey-marker,
    .rn-journey-step:hover .rn-journey-icon { transform:none !important; }
    .rn-chart-state { transition:none !important; }
}

/* ================================================================
 * RAINNUM-WEB-01.1D — Demo Request / Lead Intake / Commercial Conversion.
 * The commercial conversion is real, but its authority lives in
 * rainnum-web-core. The theme only provides the visual destination.
 * ================================================================ */
.rn-story-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px 28px;
    margin-top: 34px;
}
.rn-story-actions .rn-story-jump { margin-top: 0; }
.rn-demo-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    color: var(--rn-ink);
    font: 700 14px/1 var(--rn-font-ui);
    text-decoration: none;
    transition: color .22s ease, transform .22s ease;
}
.rn-demo-cta span { color: var(--rn-blue); font-size: 18px; transition: transform .22s ease; }
.rn-demo-cta:hover { color: var(--rn-blue); transform: translateY(-1px); }
.rn-demo-cta:hover span { transform: translateX(3px); }
.rn-demo-cta:focus-visible,
.rn-demo-submit:focus-visible,
.rn-demo-request-form input:focus-visible,
.rn-demo-request-form select:focus-visible,
.rn-demo-request-form textarea:focus-visible {
    outline: 3px solid rgba(1,102,255,.22);
    outline-offset: 3px;
}

.rn-closing-story--conversion {
    min-height: 0;
    padding: clamp(92px, 10vw, 150px) 0 clamp(84px, 9vw, 130px);
    scroll-margin-top: 24px;
}
.rn-closing-story--conversion::before {
    width: 760px;
    height: 760px;
    left: 26%;
    top: 48%;
    background: rgba(1,102,255,.16);
    filter: blur(180px);
}
.rn-closing-conversion-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(520px, 1.1fr);
    align-items: center;
    gap: clamp(58px, 7vw, 108px);
}
.rn-closing-story--conversion .rn-closing-story-inner {
    max-width: 650px;
    text-align: left;
}
.rn-closing-story--conversion h2 {
    max-width: 650px;
    margin-inline: 0;
    font-size: clamp(38px, 4.05vw, 55px);
}
.rn-closing-story--conversion .rn-closing-story-inner > p:not(.rn-story-eyebrow) {
    max-width: 610px;
    margin: 26px 0 0;
}
.rn-closing-story--conversion .rn-closing-drops {
    width: 230px;
    margin: 42px 0 0;
}
.rn-closing-promise {
    display: grid;
    gap: 11px;
    margin-top: 30px;
    color: #DCE8F2;
    font: 600 13px/1.4 var(--rn-font-ui);
}
.rn-closing-promise span { display: flex; align-items: center; gap: 10px; }
.rn-closing-promise i {
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    color: #001634;
    background: #57D6C3;
    font: 800 11px/1 var(--rn-font-ui);
    font-style: normal;
}

.rn-demo-request-card {
    position: relative;
    overflow: hidden;
    padding: clamp(30px, 4vw, 48px);
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 30px;
    background: rgba(255,255,255,.975);
    box-shadow: 0 38px 90px rgba(0,14,40,.34);
    color: var(--rn-ink);
}
.rn-demo-request-card::before {
    content: "";
    position: absolute;
    width: 300px;
    height: 300px;
    right: -110px;
    top: -130px;
    border-radius: 50%;
    background: rgba(87,214,195,.16);
    filter: blur(60px);
    pointer-events: none;
}
.rn-demo-request-card-head { position: relative; z-index: 1; margin-bottom: 28px; }
.rn-demo-request-card-head .rn-story-eyebrow { margin-bottom: 12px; }
.rn-demo-request-card-head h3 {
    max-width: 560px;
    margin: 0;
    color: var(--rn-ink);
    font-family: var(--rn-font-heavy);
    font-size: clamp(28px, 2.7vw, 38px);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -.025em;
}
.rn-demo-request-card-head > p:not(.rn-story-eyebrow) {
    max-width: 560px;
    margin: 15px 0 0;
    color: #62738A;
    font: 15px/1.58 var(--rn-font-ui);
}
.rn-demo-request-form-wrap { position: relative; z-index: 1; }
.rn-demo-request-form { display: grid; gap: 17px; }
.rn-demo-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.rn-demo-field { display: grid; gap: 8px; margin: 0; }
.rn-demo-field > span {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    color: #30435B;
    font: 700 12px/1.2 var(--rn-font-ui);
}
.rn-demo-field > span small { color: #8A98A9; font-size: 10px; font-weight: 600; }
.rn-demo-request-form input[type="text"],
.rn-demo-request-form input[type="email"],
.rn-demo-request-form select,
.rn-demo-request-form textarea {
    width: 100%;
    min-height: 49px;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid #D8E1E8;
    border-radius: 12px;
    background: #FBFCFD;
    color: var(--rn-ink);
    font: 500 14px/1.45 var(--rn-font-ui);
    box-shadow: none;
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.rn-demo-request-form textarea { min-height: 106px; resize: vertical; }
.rn-demo-request-form input::placeholder,
.rn-demo-request-form textarea::placeholder { color: #98A5B4; }
.rn-demo-request-form input:hover,
.rn-demo-request-form select:hover,
.rn-demo-request-form textarea:hover { border-color: #BCCAD5; }
.rn-demo-request-form input:focus,
.rn-demo-request-form select:focus,
.rn-demo-request-form textarea:focus {
    border-color: #8BB8FF;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(1,102,255,.07);
}
.rn-demo-consent {
    display: grid;
    grid-template-columns: 18px 1fr;
    gap: 11px;
    align-items: start;
    color: #586B82;
    font: 12px/1.52 var(--rn-font-ui);
    cursor: pointer;
}
.rn-demo-consent input {
    width: 17px;
    height: 17px;
    margin: 1px 0 0;
    accent-color: #0166FF;
}
.rn-demo-privacy-note {
    margin: -4px 0 0;
    color: #8A98A9;
    font: 10px/1.45 var(--rn-font-ui);
}
.rn-demo-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 52px;
    width: 100%;
    margin-top: 3px;
    padding: 14px 18px;
    border: 0;
    border-radius: 13px;
    background: #001634;
    color: #fff;
    font: 750 14px/1 var(--rn-font-ui);
    cursor: pointer;
    box-shadow: 0 13px 28px rgba(0,22,52,.16);
    transition: transform .22s ease, background-color .22s ease, box-shadow .22s ease;
}
.rn-demo-submit i { color: #57D6C3; font-size: 18px; font-style: normal; transition: transform .22s ease; }
.rn-demo-submit:hover { transform: translateY(-2px); background: #062451; box-shadow: 0 16px 32px rgba(0,22,52,.21); }
.rn-demo-submit:hover i { transform: translateX(4px); }
.rn-demo-honeypot {
    position: absolute !important;
    left: -10000px !important;
    top: auto !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}
.rn-demo-form-notice {
    display: grid;
    gap: 5px;
    margin-bottom: 18px;
    padding: 13px 15px;
    border-radius: 11px;
    font-family: var(--rn-font-ui);
}
.rn-demo-form-notice strong { font-size: 12px; }
.rn-demo-form-notice span { font-size: 11px; line-height: 1.45; }
.rn-demo-form-notice--error { border: 1px solid #F2D2C8; background: #FFF7F4; color: #7B3E30; }
.rn-demo-success {
    position: relative;
    z-index: 1;
    min-height: 330px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 12px 3px;
}
.rn-demo-success-mark {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin-bottom: 25px;
    border-radius: 50%;
    background: #DDF8F3;
    color: #0A8577;
    font: 800 22px/1 var(--rn-font-ui);
}
.rn-demo-success h3 {
    margin: 0;
    color: var(--rn-ink);
    font-family: var(--rn-font-heavy);
    font-size: clamp(30px, 3vw, 42px);
    line-height: 1;
}
.rn-demo-success > p:not(.rn-story-eyebrow) {
    max-width: 520px;
    margin: 18px 0 0;
    color: #5D7087;
    font: 15px/1.58 var(--rn-font-ui);
}
.rn-demo-success small {
    max-width: 520px;
    margin-top: 22px;
    color: #8B99A8;
    font: 11px/1.5 var(--rn-font-ui);
}

@media (max-width: 1080px) {
    .rn-closing-conversion-grid { grid-template-columns: 1fr; gap: 56px; }
    .rn-closing-story--conversion .rn-closing-story-inner { max-width: 760px; }
    .rn-demo-request-card { max-width: 760px; }
}
@media (max-width: 620px) {
    .rn-story-actions { align-items: flex-start; flex-direction: column; gap: 14px; }
    .rn-closing-story--conversion { padding-top: 80px; }
    .rn-closing-conversion-grid { gap: 46px; }
    .rn-demo-request-card { padding: 27px 22px; border-radius: 23px; }
    .rn-demo-form-grid { grid-template-columns: 1fr; }
    .rn-demo-request-card-head h3 { font-size: clamp(28px, 8.4vw, 36px); }
    .rn-closing-story--conversion h2 { font-size: clamp(37px, 10vw, 48px); }
}
@media (prefers-reduced-motion: reduce) {
    .rn-demo-cta,
    .rn-demo-cta span,
    .rn-demo-submit,
    .rn-demo-submit i { transition: none !important; transform: none !important; }
}

/* ==============================================================
 * RAINNUM-WEB-01.1D.1 — Multi-Origin Demo Intake / Success State
 * ============================================================== */
.rn-demo-workflow-fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
.rn-demo-workflow-fieldset legend {
    width: 100%;
    margin: 0;
    padding: 0;
    color: #30435B;
    font: 700 12px/1.2 var(--rn-font-ui);
}
.rn-demo-workflow-fieldset > p {
    margin: 5px 0 10px;
    color: #8A98A9;
    font: 10px/1.4 var(--rn-font-ui);
}
.rn-demo-workflow-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}
.rn-demo-workflow-option {
    position: relative;
    min-width: 0;
    margin: 0;
    cursor: pointer;
}
.rn-demo-workflow-option:last-child { grid-column: 1 / -1; }
.rn-demo-workflow-option input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    opacity: 0;
    pointer-events: none;
}
.rn-demo-workflow-option > span {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 45px;
    padding: 10px 12px;
    border: 1px solid #D8E1E8;
    border-radius: 12px;
    background: #FBFCFD;
    color: #42556B;
    font: 650 12px/1.3 var(--rn-font-ui);
    transition: border-color .2s ease, background-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.rn-demo-workflow-option i {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    border: 1px solid #C9D5DE;
    border-radius: 7px;
    color: transparent;
    background: #fff;
    font: 800 11px/1 var(--rn-font-ui);
    font-style: normal;
    transition: inherit;
}
.rn-demo-workflow-option:hover > span {
    border-color: #B8C9D6;
    background: #fff;
    transform: translateY(-1px);
}
.rn-demo-workflow-option:has(input:checked) > span {
    border-color: #9FC2FF;
    background: #F3F7FF;
    color: #063B8D;
    box-shadow: 0 7px 18px rgba(1,102,255,.07);
}
.rn-demo-workflow-option:has(input:checked) i {
    border-color: #0166FF;
    background: #0166FF;
    color: #fff;
}
.rn-demo-workflow-option input:focus-visible + span {
    outline: 3px solid rgba(1,102,255,.22);
    outline-offset: 3px;
}
.rn-demo-workflow-fieldset.is-invalid .rn-demo-workflow-options {
    border-radius: 14px;
    box-shadow: 0 0 0 3px rgba(160,60,42,.12);
}
.rn-demo-request-card--success {
    display: flex;
    align-items: center;
    min-height: 500px;
}
.rn-demo-request-card--success .rn-demo-request-form-wrap { width: 100%; }
.rn-demo-success-next {
    max-width: 520px;
    margin: 12px 0 0 !important;
    color: #30435B !important;
    font-weight: 650 !important;
}
@media (max-width: 620px) {
    .rn-demo-workflow-options { grid-template-columns: 1fr; }
    .rn-demo-workflow-option:last-child { grid-column: auto; }
    .rn-demo-request-card--success { min-height: 390px; }
}
@media (prefers-reduced-motion: reduce) {
    .rn-demo-workflow-option > span,
    .rn-demo-workflow-option i { transition: none !important; transform: none !important; }
}

/* ==============================================================
 * RAINNUM-WEB-01.1E — Public Readiness / Legal / Accessibility
 * ============================================================== */
.rn-site-header--solid {
    background: #001634;
    color: #fff;
    border-bottom: 1px solid rgba(172,229,226,.12);
}
.rn-body--inner .rn-main { min-height: 58vh; }
.rn-body--inner .rn-generic-main { padding-top: clamp(72px, 8vw, 112px); }
.rn-body--inner .rn-generic-card { max-width: 980px; }
.rn-body--inner .rn-site-footer--landing { margin-top: auto; }

.rn-footer-inner { flex-wrap: wrap; }
.rn-footer-legal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px 18px;
    color: #B7C7D6;
    font: 600 11px/1.4 var(--rn-font-ui);
}
.rn-footer-legal a {
    text-decoration: none;
    text-underline-offset: 4px;
}
.rn-footer-legal a:hover { color: #fff; text-decoration: underline; }
.rn-footer-legal a:focus-visible {
    outline: 3px solid rgba(172,229,226,.72);
    outline-offset: 5px;
    border-radius: 4px;
}

.rn-legal-document,
.rn-contact-document,
.rn-demo-standalone {
    color: #40536A;
    font: 15px/1.7 var(--rn-font-ui);
}
.rn-legal-intro {
    max-width: 760px;
    margin: 0 0 32px;
    color: #53687F;
    font-size: 17px;
    line-height: 1.65;
}
.rn-legal-document h2,
.rn-contact-document h2 {
    margin: 40px 0 12px;
    color: var(--rn-ink);
    font-family: var(--rn-font-heavy);
    font-size: clamp(22px, 3vw, 30px);
    line-height: 1.1;
    letter-spacing: -.025em;
}
.rn-legal-document p,
.rn-contact-document p { max-width: 790px; }
.rn-legal-document a,
.rn-contact-document a:not(.rn-public-cta),
.rn-demo-privacy-note a {
    color: #005AD8;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.rn-legal-document a:hover,
.rn-contact-document a:not(.rn-public-cta):hover,
.rn-demo-privacy-note a:hover { color: #003B91; }
.rn-legal-data {
    display: grid;
    gap: 1px;
    margin: 20px 0 34px;
    overflow: hidden;
    border: 1px solid #DCE5EB;
    border-radius: 16px;
    background: #DCE5EB;
}
.rn-legal-data > div {
    display: grid;
    grid-template-columns: minmax(150px, 220px) minmax(0,1fr);
    gap: 20px;
    padding: 14px 16px;
    background: #fff;
}
.rn-legal-data dt { color: #687A8E; font-weight: 650; }
.rn-legal-data dd { margin: 0; color: #23364D; }
.rn-legal-warning {
    display: grid;
    gap: 3px;
    margin-bottom: 26px;
    padding: 14px 16px;
    border: 1px solid #F0D7A9;
    border-radius: 13px;
    background: #FFF9EC;
    color: #745112;
}
.rn-legal-warning strong { color: #5A3D09; }
.rn-public-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 24px; }
.rn-public-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 46px;
    padding: 12px 17px;
    border-radius: 12px;
    background: #001634;
    color: #fff !important;
    font: 750 13px/1 var(--rn-font-ui);
    text-decoration: none !important;
    box-shadow: 0 10px 24px rgba(0,22,52,.13);
    transition: transform .2s ease, background-color .2s ease;
}
.rn-public-cta span { color: #57D6C3; }
.rn-public-cta:hover { background: #062451; transform: translateY(-1px); }
.rn-public-cta:focus-visible,
.rn-legal-document a:focus-visible,
.rn-contact-document a:focus-visible,
.rn-demo-privacy-note a:focus-visible {
    outline: 3px solid rgba(1,102,255,.24);
    outline-offset: 4px;
    border-radius: 5px;
}
.rn-demo-standalone .rn-demo-request-form-wrap { max-width: 760px; }
.rn-demo-standalone .rn-demo-request-form { display: grid; gap: 17px; }
.rn-demo-standalone .rn-demo-success { min-height: 280px; }

[id] { scroll-margin-top: 84px; }
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
a:focus-visible { outline-offset: 3px; }

@media (max-width: 880px) {
    .rn-footer-inner { align-items: flex-start; }
    .rn-footer-legal { order: 3; width: 100%; justify-content: flex-start; padding-top: 4px; }
}
@media (max-width: 620px) {
    .rn-legal-data > div { grid-template-columns: 1fr; gap: 4px; }
    .rn-footer-legal { gap: 10px 16px; }
}
@media (forced-colors: active) {
    .rn-public-cta,
    .rn-demo-submit,
    .rn-demo-workflow-option > span { border: 1px solid ButtonText; }
}
@media (prefers-reduced-motion: reduce) {
    .rn-public-cta { transition: none !important; transform: none !important; }
}

/* ==============================================================
 * RAINNUM-WEB-01.1E.2 — Canonical Rainnum 404
 * ============================================================== */
body.error404.rn-body--inner {
    background: #001634;
}
.error404 .rn-site-shell {
    min-height: 100vh;
    background: #001634;
}
.error404 .rn-site-header--solid {
    border-bottom-color: rgba(172,229,226,.08);
}
.rn-404-stage {
    position: relative;
    display: grid;
    align-items: center;
    min-height: clamp(620px, 78vh, 900px);
    overflow: hidden;
    background:
        radial-gradient(circle at 78% 44%, rgba(1,102,255,.28) 0, rgba(1,102,255,.10) 25%, rgba(1,102,255,0) 58%),
        linear-gradient(180deg, #001634 0%, #002A64 64%, #003B8E 100%);
    color: #fff;
}
.rn-404-stage::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 180px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(0,22,52,0), #001634 88%);
}
.rn-404-layout {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0,.9fr) minmax(360px,1.1fr);
    gap: clamp(50px, 9vw, 150px);
    align-items: center;
    padding-top: clamp(70px, 8vw, 110px);
    padding-bottom: clamp(90px, 10vw, 145px);
}
.rn-404-copy { max-width: 680px; }
.rn-404-eyebrow {
    margin: 0 0 22px;
    color: #79AFFF;
    font: 800 12px/1.2 var(--rn-font-ui);
    letter-spacing: .18em;
    text-transform: uppercase;
}
.rn-404-copy h1 {
    max-width: 650px;
    margin: 0;
    color: #fff;
    font-family: var(--rn-font-heavy);
    font-size: clamp(46px, 6vw, 82px);
    font-weight: 800;
    line-height: .99;
    letter-spacing: -.045em;
}
.rn-404-lead {
    max-width: 590px;
    margin: 28px 0 0;
    color: #C5D3E2;
    font: 16px/1.7 var(--rn-font-ui);
}
.rn-404-actions { margin-top: 34px; }
.rn-public-cta--light {
    background: #fff;
    color: #001634 !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.17);
}
.rn-public-cta--light:hover { background: #F4F8FF; }
.rn-404-text-link {
    color: #D9E6F2;
    font: 700 13px/1.2 var(--rn-font-ui);
    text-decoration: none;
    text-underline-offset: 4px;
}
.rn-404-text-link:hover { color: #fff; text-decoration: underline; }
.rn-404-text-link:focus-visible { outline: 3px solid rgba(172,229,226,.72); outline-offset: 5px; border-radius: 4px; }

.rn-404-mark {
    position: relative;
    display: grid;
    grid-template-columns: auto clamp(120px, 12vw, 180px) auto;
    align-items: center;
    justify-content: center;
    min-height: 360px;
    filter: drop-shadow(0 24px 60px rgba(0,0,0,.18));
}
.rn-404-four {
    color: rgba(255,255,255,.94);
    font-family: var(--rn-font-heavy);
    font-size: clamp(112px, 14vw, 205px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.08em;
}
.rn-404-zero {
    position: relative;
    width: clamp(118px, 11vw, 170px);
    aspect-ratio: 1 / 1.18;
}
.rn-404-zero i {
    position: absolute;
    width: clamp(9px, .85vw, 13px);
    height: clamp(9px, .85vw, 13px);
    border-radius: 50%;
    background: #2E83FF;
    box-shadow: 0 0 24px rgba(1,102,255,.25);
}
.rn-404-zero i:nth-child(1)  { left: 35%; top: 2%; }
.rn-404-zero i:nth-child(2)  { left: 55%; top: 2%; }
.rn-404-zero i:nth-child(3)  { left: 17%; top: 15%; }
.rn-404-zero i:nth-child(4)  { left: 72%; top: 15%; }
.rn-404-zero i:nth-child(5)  { left: 8%; top: 35%; }
.rn-404-zero i:nth-child(6)  { left: 81%; top: 35%; }
.rn-404-zero i:nth-child(7)  { left: 8%; top: 58%; }
.rn-404-zero i:nth-child(8)  { left: 81%; top: 58%; }
.rn-404-zero i:nth-child(9)  { left: 17%; top: 78%; }
.rn-404-zero i:nth-child(10) { left: 72%; top: 78%; }
.rn-404-zero i:nth-child(11) { left: 35%; top: 91%; }
.rn-404-zero i:nth-child(12) { left: 55%; top: 91%; }
.rn-404-rain {
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #57D6C3;
    opacity: .85;
}
.rn-404-rain--one { left: 50%; top: 90%; transform: translateX(-50%); }
.rn-404-rain--two { left: 56%; top: 103%; width: 7px; height: 7px; opacity: .45; }
.error404 .rn-site-footer--landing {
    margin-top: 0;
    background: #001634;
}
.error404 .rn-footer-inner { border-top-color: rgba(172,229,226,.1); }

@media (max-width: 900px) {
    .rn-404-layout { grid-template-columns: 1fr; gap: 26px; }
    .rn-404-copy { text-align: center; margin-inline: auto; }
    .rn-404-lead { margin-inline: auto; }
    .rn-404-actions { justify-content: center; }
    .rn-404-mark { min-height: 250px; transform: scale(.86); transform-origin: top center; }
}
@media (max-width: 560px) {
    .rn-404-stage { min-height: 760px; }
    .rn-404-layout { padding-top: 62px; padding-bottom: 88px; }
    .rn-404-copy h1 { font-size: clamp(42px, 12vw, 58px); }
    .rn-404-mark { min-height: 210px; transform: scale(.72); }
    .rn-404-actions { align-items: stretch; flex-direction: column; }
    .rn-404-actions .rn-public-cta { width: 100%; }
}
@media (prefers-reduced-motion: no-preference) {
    .rn-404-zero i { animation: rn404Pulse 3.8s ease-in-out infinite; }
    .rn-404-zero i:nth-child(2n) { animation-delay: -.9s; }
    .rn-404-zero i:nth-child(3n) { animation-delay: -1.8s; }
    .rn-404-rain--one { animation: rn404Drop 2.9s ease-in infinite; }
    .rn-404-rain--two { animation: rn404DropSmall 2.9s 1.1s ease-in infinite; }
}
@keyframes rn404Pulse {
    0%,100% { transform: scale(.88); opacity: .56; }
    50% { transform: scale(1.12); opacity: 1; }
}
@keyframes rn404Drop {
    0%,18% { transform: translate(-50%, -16px); opacity: 0; }
    36% { opacity: .85; }
    100% { transform: translate(-50%, 74px); opacity: 0; }
}
@keyframes rn404DropSmall {
    0%,18% { transform: translateY(-14px); opacity: 0; }
    38% { opacity: .45; }
    100% { transform: translateY(54px); opacity: 0; }
}
@media (forced-colors: active) {
    .rn-404-stage { background: Canvas; color: CanvasText; }
    .rn-404-copy h1, .rn-404-four, .rn-404-text-link { color: CanvasText; }
    .rn-404-zero i, .rn-404-rain { forced-color-adjust: none; }
}
\n\n/* ==============================================================\n * RAINNUM-WEB-01.1E.3 — Public Launch / Demo Success Reset\n * ============================================================== */\n.rn-demo-success-reset {\n    display: inline-flex;\n    align-items: center;\n    gap: 9px;\n    margin-top: 28px;\n    padding: 11px 15px;\n    border: 1px solid #CBD8E2;\n    border-radius: 999px;\n    background: rgba(255,255,255,.76);\n    color: #001634;\n    font: 700 12px/1 var(--rn-font-ui);\n    text-decoration: none;\n    box-shadow: 0 8px 20px rgba(0,22,52,.05);\n    transition: transform .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease;\n}\n.rn-demo-success-reset i {\n    color: #0166FF;\n    font-size: 15px;\n    font-style: normal;\n    transition: transform .2s ease;\n}\n.rn-demo-success-reset:hover {\n    transform: translateY(-1px);\n    border-color: #9FC2FF;\n    color: #0166FF;\n    box-shadow: 0 11px 24px rgba(1,102,255,.08);\n}\n.rn-demo-success-reset:hover i { transform: translateX(3px); }\n.rn-demo-success-reset:focus-visible {\n    outline: 3px solid rgba(1,102,255,.24);\n    outline-offset: 3px;\n}\n@media (prefers-reduced-motion: reduce) {\n    .rn-demo-success-reset,\n    .rn-demo-success-reset i { transition: none !important; transform: none !important; }\n}\n
/* ================================================================
 * RAINNUM-WEB-01.1H — Living Hero / Brand Motion + Audience Reflection
 * Keep the physically approved hero copy and gradient untouched. This layer
 * only lowers header-logo dominance, adds a sparse Rainnum rain current and
 * lets real customer profiles surface gently near the light end of the hero.
 * ================================================================ */

/* The public wordmark was intentionally dominant during launch. Now that the
 * Access handoff is present, a ~19% reduction gives the header more editorial
 * air and brings the mark closer to the quieter footer scale. */
.rn-brand--inverse { width: 160px; max-width: 38vw; }

.rn-hero-rain {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    pointer-events: none;
}
.rn-hero-drop,
.rn-hero-bridge-drop {
    position: absolute;
    display: block;
    width: var(--rn-drop-w, 10px);
    height: var(--rn-drop-h, 13px);
    border-radius: 58% 58% 62% 62% / 40% 40% 70% 70%;
    background: linear-gradient(145deg, rgba(172,229,226,.76), rgba(87,214,195,.66) 44%, rgba(1,102,255,.56));
    box-shadow: 0 10px 28px rgba(1,102,255,.08);
    opacity: 0;
    transform: rotate(45deg);
    will-change: transform, opacity;
}
.rn-hero-drop--1 { left: 9%;  top: -8%; --rn-drop-w: 8px;  --rn-drop-h: 11px; --rn-drop-opacity: .34; --rn-drop-duration: 18s; --rn-drop-delay: -13s; }
.rn-hero-drop--2 { left: 22%; top: -12%; --rn-drop-w: 11px; --rn-drop-h: 14px; --rn-drop-opacity: .24; --rn-drop-duration: 23s; --rn-drop-delay: -4s; }
.rn-hero-drop--3 { left: 38%; top: -10%; --rn-drop-w: 7px;  --rn-drop-h: 10px; --rn-drop-opacity: .28; --rn-drop-duration: 20s; --rn-drop-delay: -17s; }
.rn-hero-drop--4 { left: 55%; top: -14%; --rn-drop-w: 12px; --rn-drop-h: 16px; --rn-drop-opacity: .21; --rn-drop-duration: 25s; --rn-drop-delay: -10s; }
.rn-hero-drop--5 { left: 68%; top: -9%;  --rn-drop-w: 8px;  --rn-drop-h: 11px; --rn-drop-opacity: .30; --rn-drop-duration: 19s; --rn-drop-delay: -2s; }
.rn-hero-drop--6 { left: 81%; top: -13%; --rn-drop-w: 10px; --rn-drop-h: 13px; --rn-drop-opacity: .22; --rn-drop-duration: 22s; --rn-drop-delay: -15s; }
.rn-hero-drop--7 { left: 92%; top: -7%;  --rn-drop-w: 6px;  --rn-drop-h: 9px;  --rn-drop-opacity: .25; --rn-drop-duration: 17s; --rn-drop-delay: -8s; }

.rn-motion-enabled .rn-hero-drop {
    animation: rn-hero-drop-fall var(--rn-drop-duration) linear var(--rn-drop-delay) infinite;
}

.rn-hero-audience {
    position: absolute;
    z-index: 4;
    left: 50%;
    bottom: clamp(46px, 6.2vh, 82px);
    width: min(calc(100% - 48px), 1040px);
    transform: translateX(-50%);
    text-align: center;
}
.rn-hero-audience-question {
    margin: 0 0 16px;
    color: rgba(0,22,52,.82);
    font-family: var(--rn-font-ui);
    font-size: clamp(18px, 1.55vw, 22px);
    font-weight: 760;
    line-height: 1.2;
    letter-spacing: -0.02em;
}
.rn-hero-audience-stream {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    width: min(100%, 900px);
    margin: 0 auto;
    padding: 0;
    list-style: none;
}
.rn-hero-audience-stream li {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 6px 12px 5px;
    border: 1px solid rgba(0,22,52,.11);
    border-radius: 999px;
    background: rgba(255,255,255,.52);
    color: rgba(0,22,52,.72);
    font: 650 12px/1.1 var(--rn-font-ui);
    letter-spacing: -0.01em;
    box-shadow: 0 8px 24px rgba(0,22,52,.035);
}

/* With motion available the list becomes a slow current rather than a ticker:
 * every profile rises only a few pixels, rests in view and fades before the
 * next ones surface. Nothing moves horizontally and the headline stays still. */
.rn-motion-enabled .rn-hero-audience-stream {
    position: relative;
    display: block;
    height: 104px;
    overflow: hidden;
}
.rn-motion-enabled .rn-hero-audience-stream li {
    position: absolute;
    top: var(--rn-profile-top, 54px);
    left: var(--rn-profile-left, 50%);
    opacity: 0;
    transform: translate3d(-50%, 24px, 0);
    animation: rn-audience-rise var(--rn-profile-duration, 16s) cubic-bezier(.22,.66,.28,1) var(--rn-profile-delay, 0s) infinite;
    will-change: transform, opacity;
    white-space: nowrap;
}
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(1)  { --rn-profile-left: 14%; --rn-profile-top: 44px; --rn-profile-delay: -13s; --rn-profile-duration: 17s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(2)  { --rn-profile-left: 31%; --rn-profile-top: 70px; --rn-profile-delay: -7s;  --rn-profile-duration: 18s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(3)  { --rn-profile-left: 48%; --rn-profile-top: 38px; --rn-profile-delay: -15s; --rn-profile-duration: 20s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(4)  { --rn-profile-left: 67%; --rn-profile-top: 66px; --rn-profile-delay: -4s;  --rn-profile-duration: 19s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(5)  { --rn-profile-left: 84%; --rn-profile-top: 42px; --rn-profile-delay: -10s; --rn-profile-duration: 18s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(6)  { --rn-profile-left: 23%; --rn-profile-top: 76px; --rn-profile-delay: -1s;  --rn-profile-duration: 21s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(7)  { --rn-profile-left: 40%; --rn-profile-top: 58px; --rn-profile-delay: -9s;  --rn-profile-duration: 19s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(8)  { --rn-profile-left: 58%; --rn-profile-top: 78px; --rn-profile-delay: -17s; --rn-profile-duration: 22s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(9)  { --rn-profile-left: 74%; --rn-profile-top: 54px; --rn-profile-delay: -6s;  --rn-profile-duration: 20s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(10) { --rn-profile-left: 91%; --rn-profile-top: 74px; --rn-profile-delay: -12s; --rn-profile-duration: 21s; }

/* A pair of drops starts just above the next light chapter, visually carrying
 * the rain over the hard DOM boundary without allowing the hero to overflow. */
.rn-hero-bridge-rain {
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    right: 0;
    height: 150px;
    overflow: hidden;
    pointer-events: none;
}
.rn-hero-bridge-drop { top: -38px; }
.rn-hero-bridge-drop--1 { left: 18%; --rn-drop-w: 8px; --rn-drop-h: 11px; --rn-drop-opacity: .26; --rn-drop-duration: 11s; --rn-drop-delay: -7s; }
.rn-hero-bridge-drop--2 { right: 16%; --rn-drop-w: 6px; --rn-drop-h: 9px; --rn-drop-opacity: .20; --rn-drop-duration: 13s; --rn-drop-delay: -2s; }
.rn-motion-enabled .rn-hero-bridge-drop {
    animation: rn-hero-bridge-fall var(--rn-drop-duration) linear var(--rn-drop-delay) infinite;
}

@keyframes rn-hero-drop-fall {
    0%   { opacity: 0; transform: translate3d(0,-70px,0) rotate(45deg) scale(.82); }
    10%  { opacity: var(--rn-drop-opacity); }
    68%  { opacity: calc(var(--rn-drop-opacity) * .86); }
    92%  { opacity: calc(var(--rn-drop-opacity) * .48); }
    100% { opacity: 0; transform: translate3d(18px,112svh,0) rotate(45deg) scale(1.04); }
}
@keyframes rn-audience-rise {
    0%, 8%   { opacity: 0; transform: translate3d(-50%,24px,0); }
    18%      { opacity: .20; }
    30%, 56% { opacity: .74; transform: translate3d(-50%,4px,0); }
    76%      { opacity: .42; transform: translate3d(-50%,-10px,0); }
    90%,100% { opacity: 0; transform: translate3d(-50%,-22px,0); }
}
@keyframes rn-hero-bridge-fall {
    0%   { opacity: 0; transform: translate3d(0,-32px,0) rotate(45deg) scale(.82); }
    24%  { opacity: var(--rn-drop-opacity); }
    78%  { opacity: calc(var(--rn-drop-opacity) * .62); }
    100% { opacity: 0; transform: translate3d(6px,178px,0) rotate(45deg) scale(.96); }
}

@media (max-width: 680px) {
    .rn-brand--inverse { width: 132px; max-width: 46vw; }
    .rn-hero-audience {
        bottom: 30px;
        width: min(calc(100% - 28px), 540px);
    }
    .rn-hero-audience-question {
        margin-bottom: 10px;
        font-size: 17px;
    }
    .rn-hero-audience-stream { gap: 6px; }
    .rn-hero-audience-stream li {
        min-height: 27px;
        padding: 5px 9px 4px;
        font-size: 10px;
    }
    .rn-motion-enabled .rn-hero-audience-stream { height: 91px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(n+8) { display: none; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(1) { --rn-profile-left: 18%; --rn-profile-top: 35px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(2) { --rn-profile-left: 52%; --rn-profile-top: 60px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(3) { --rn-profile-left: 79%; --rn-profile-top: 32px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(4) { --rn-profile-left: 30%; --rn-profile-top: 68px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(5) { --rn-profile-left: 70%; --rn-profile-top: 62px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(6) { --rn-profile-left: 43%; --rn-profile-top: 41px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(7) { --rn-profile-left: 86%; --rn-profile-top: 72px; }
    .rn-hero-drop--2,
    .rn-hero-drop--4 { display: none; }
    .rn-hero-drop { filter: saturate(.9); }
    .rn-hero-bridge-drop--2 { display: none; }
}

@media (max-width: 390px) {
    .rn-brand--inverse { width: 122px; }
    .rn-hero-audience-question { font-size: 16px; }
    .rn-hero-audience-stream li { font-size: 9.5px; }
}

@media (prefers-reduced-motion: reduce) {
    .rn-hero-rain,
    .rn-hero-bridge-rain { display: none !important; }
    .rn-hero-audience-stream { height: auto !important; overflow: visible !important; }
    .rn-hero-audience-stream li {
        position: static !important;
        display: inline-flex !important;
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
    }
}

/* ================================================================
 * RAINNUM-WEB-01.1H.1 — Hero Rhythm / Audience Lift Polish
 * Keep 01.1H's approved rain, hero copy, gradient and header untouched.
 * The question becomes a calmer anchor near the dark/electric transition,
 * while customer profiles receive a longer, staggered upward current below.
 * ================================================================ */
.rn-hero-audience {
    top: 59%;
    bottom: auto;
    height: 39%;
    min-height: 290px;
}
.rn-hero-audience-question {
    margin-bottom: 0;
}
.rn-hero-audience-stream {
    margin-top: 22px;
}
.rn-motion-enabled .rn-hero-audience-stream {
    position: absolute;
    top: 48px;
    right: 0;
    bottom: 0;
    left: 0;
    width: min(100%, 940px);
    height: auto;
    min-height: 230px;
    overflow: hidden;
}
.rn-motion-enabled .rn-hero-audience-stream li {
    top: var(--rn-profile-top, 175px);
    transform: translate3d(-50%, 34px, 0);
    animation: rn-audience-lift var(--rn-profile-duration, 20s) cubic-bezier(.22,.66,.28,1) var(--rn-profile-delay, 0s) infinite;
}
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(1)  { --rn-profile-left: 12%; --rn-profile-top: 170px; --rn-profile-rise: 96px;  --rn-profile-delay: -15s; --rn-profile-duration: 21s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(2)  { --rn-profile-left: 28%; --rn-profile-top: 228px; --rn-profile-rise: 126px; --rn-profile-delay: -8s;  --rn-profile-duration: 23s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(3)  { --rn-profile-left: 44%; --rn-profile-top: 146px; --rn-profile-rise: 86px;  --rn-profile-delay: -18s; --rn-profile-duration: 24s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(4)  { --rn-profile-left: 62%; --rn-profile-top: 214px; --rn-profile-rise: 132px; --rn-profile-delay: -5s;  --rn-profile-duration: 22s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(5)  { --rn-profile-left: 80%; --rn-profile-top: 158px; --rn-profile-rise: 92px;  --rn-profile-delay: -12s; --rn-profile-duration: 21s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(6)  { --rn-profile-left: 20%; --rn-profile-top: 246px; --rn-profile-rise: 138px; --rn-profile-delay: -2s;  --rn-profile-duration: 25s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(7)  { --rn-profile-left: 37%; --rn-profile-top: 198px; --rn-profile-rise: 112px; --rn-profile-delay: -11s; --rn-profile-duration: 23s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(8)  { --rn-profile-left: 54%; --rn-profile-top: 260px; --rn-profile-rise: 144px; --rn-profile-delay: -20s; --rn-profile-duration: 26s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(9)  { --rn-profile-left: 72%; --rn-profile-top: 188px; --rn-profile-rise: 104px; --rn-profile-delay: -7s;  --rn-profile-duration: 24s; }
.rn-motion-enabled .rn-hero-audience-stream li:nth-child(10) { --rn-profile-left: 89%; --rn-profile-top: 236px; --rn-profile-rise: 130px; --rn-profile-delay: -14s; --rn-profile-duration: 25s; }

@keyframes rn-audience-lift {
    0%, 7%   { opacity: 0; transform: translate3d(-50%,34px,0); }
    16%      { opacity: .18; }
    28%, 50% { opacity: .70; transform: translate3d(-50%,4px,0); }
    68%      { opacity: .58; transform: translate3d(-50%,calc(var(--rn-profile-rise, 100px) * -.55),0); }
    84%      { opacity: .28; transform: translate3d(-50%,calc(var(--rn-profile-rise, 100px) * -.82),0); }
    94%,100% { opacity: 0; transform: translate3d(-50%,calc(var(--rn-profile-rise, 100px) * -1),0); }
}

@media (max-width: 680px) {
    .rn-hero-audience {
        top: 58%;
        bottom: auto;
        height: 41%;
        min-height: 300px;
    }
    .rn-hero-audience-question { margin-bottom: 0; }
    .rn-hero-audience-stream { margin-top: 18px; }
    .rn-motion-enabled .rn-hero-audience-stream {
        top: 44px;
        min-height: 250px;
    }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(1) { --rn-profile-left: 18%; --rn-profile-top: 132px; --rn-profile-rise: 78px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(2) { --rn-profile-left: 51%; --rn-profile-top: 204px; --rn-profile-rise: 118px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(3) { --rn-profile-left: 79%; --rn-profile-top: 118px; --rn-profile-rise: 72px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(4) { --rn-profile-left: 28%; --rn-profile-top: 226px; --rn-profile-rise: 126px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(5) { --rn-profile-left: 70%; --rn-profile-top: 190px; --rn-profile-rise: 108px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(6) { --rn-profile-left: 43%; --rn-profile-top: 154px; --rn-profile-rise: 88px; }
    .rn-motion-enabled .rn-hero-audience-stream li:nth-child(7) { --rn-profile-left: 86%; --rn-profile-top: 238px; --rn-profile-rise: 132px; }
}

@media (max-width: 390px) {
    .rn-hero-audience { top: 57%; height: 42%; }
}

@media (prefers-reduced-motion: reduce) {
    .rn-hero-audience {
        top: 59%;
        height: auto;
        min-height: 0;
    }
    .rn-hero-audience-stream { margin-top: 18px; }
}

/* ================================================================
 * RAINNUM-WEB-01.1H.2 — Hero Balance / Cross-Section Brand Continuity
 * Small visual polish only: a quieter header signature, a stronger audience
 * question with extra mobile breathing room, and sparse Rainnum drops that
 * visibly cross two chapter boundaries. No new JS or product/content changes.
 * ================================================================ */

/* Header mark becomes a signature rather than a second headline. */
.rn-brand--inverse {
    width: 138px;
    max-width: 34vw;
}

/* The audience question is now part of the light-on-blue brand language. */
.rn-hero-audience-question {
    color: rgba(255,255,255,.94);
    font-size: clamp(21px, 1.75vw, 25px);
    font-weight: 780;
    text-shadow: 0 1px 18px rgba(0,22,52,.12);
}

/* Zero-height bridge: the drops are allowed to exist on both sides of a DOM
 * boundary, so they genuinely read as continuity rather than decoration inside
 * one section. */
.rn-section-bridge-rain {
    position: relative;
    z-index: 9;
    height: 0;
    pointer-events: none;
    overflow: visible;
}
.rn-section-bridge-drop {
    position: absolute;
    top: -62px;
    width: var(--rn-cross-w, 8px);
    height: var(--rn-cross-h, 11px);
    border-radius: 58% 58% 62% 62% / 40% 40% 70% 70%;
    opacity: 0;
    transform: rotate(45deg) translate3d(0,-10px,0);
    will-change: transform, opacity;
}
.rn-section-bridge-rain--into-dark .rn-section-bridge-drop {
    background: linear-gradient(145deg, rgba(172,229,226,.88), rgba(87,214,195,.76) 48%, rgba(112,167,255,.70));
    box-shadow: 0 9px 24px rgba(1,102,255,.12);
}
.rn-section-bridge-rain--into-light .rn-section-bridge-drop {
    background: linear-gradient(145deg, rgba(87,214,195,.78), rgba(59,163,190,.62) 52%, rgba(1,102,255,.50));
    box-shadow: 0 8px 22px rgba(0,22,52,.08);
}
.rn-section-bridge-rain--into-dark .rn-section-bridge-drop--1 { left: 17%; --rn-cross-w: 8px;  --rn-cross-h: 11px; --rn-cross-duration: 9.5s; --rn-cross-delay: -6.5s; --rn-cross-opacity: .56; --rn-cross-travel: 138px; }
.rn-section-bridge-rain--into-dark .rn-section-bridge-drop--2 { left: 53%; --rn-cross-w: 6px;  --rn-cross-h: 9px;  --rn-cross-duration: 11s;  --rn-cross-delay: -2.1s; --rn-cross-opacity: .38; --rn-cross-travel: 116px; }
.rn-section-bridge-rain--into-dark .rn-section-bridge-drop--3 { right: 13%; --rn-cross-w: 10px; --rn-cross-h: 14px; --rn-cross-duration: 10.4s;--rn-cross-delay: -8.2s; --rn-cross-opacity: .44; --rn-cross-travel: 150px; }
.rn-section-bridge-rain--into-light .rn-section-bridge-drop--1 { left: 26%; --rn-cross-w: 7px; --rn-cross-h: 10px; --rn-cross-duration: 10.8s; --rn-cross-delay: -7.4s; --rn-cross-opacity: .40; --rn-cross-travel: 126px; }
.rn-section-bridge-rain--into-light .rn-section-bridge-drop--2 { right: 21%; --rn-cross-w: 9px; --rn-cross-h: 12px; --rn-cross-duration: 12s; --rn-cross-delay: -3.2s; --rn-cross-opacity: .31; --rn-cross-travel: 142px; }

.rn-motion-enabled .rn-section-bridge-drop {
    animation: rn-section-drop-cross var(--rn-cross-duration, 11s) linear var(--rn-cross-delay, 0s) infinite;
}
@keyframes rn-section-drop-cross {
    0%, 7% { opacity: 0; transform: rotate(45deg) translate3d(0,-12px,0); }
    17% { opacity: var(--rn-cross-opacity, .40); }
    67% { opacity: calc(var(--rn-cross-opacity, .40) * .78); }
    90% { opacity: calc(var(--rn-cross-opacity, .40) * .28); }
    100% { opacity: 0; transform: rotate(45deg) translate3d(5px,var(--rn-cross-travel, 132px),0); }
}

@media (max-width: 680px) {
    .rn-brand--inverse {
        width: 112px;
        max-width: 42vw;
    }
    /* 01.1H.1 intentionally lifted the question; on a tall phone it came too
     * close to the large headline. Give it back roughly one line of breathing
     * room while keeping ample travel for the audience profiles below. */
    .rn-hero-audience {
        top: 62%;
        height: 37%;
        min-height: 285px;
    }
    .rn-hero-audience-question {
        font-size: 20px;
        line-height: 1.18;
    }
    .rn-motion-enabled .rn-hero-audience-stream {
        top: 48px;
        min-height: 230px;
    }
    .rn-section-bridge-rain--into-dark .rn-section-bridge-drop--2,
    .rn-section-bridge-rain--into-light .rn-section-bridge-drop--2 {
        display: none;
    }
    .rn-section-bridge-rain--into-dark .rn-section-bridge-drop--1 { left: 19%; }
    .rn-section-bridge-rain--into-dark .rn-section-bridge-drop--3 { right: 16%; }
    .rn-section-bridge-rain--into-light .rn-section-bridge-drop--1 { left: 72%; }
}

@media (max-width: 390px) {
    .rn-brand--inverse { width: 104px; }
    .rn-hero-audience { top: 62.5%; height: 36.5%; }
    .rn-hero-audience-question { font-size: 19px; }
}

@media (prefers-reduced-motion: reduce) {
    .rn-section-bridge-rain { display: none !important; }
    .rn-hero-audience {
        top: 61%;
        height: auto;
    }
}

/* ================================================================
 * CUSTOMER-ENABLEMENT-01B.1 — Public Help Center Foundation
 * Canonical content: normal hierarchical WordPress pages under /ayuda/.
 * The theme owns only presentation/navigation; no product behaviour lives here.
 * ================================================================ */

.rn-body--help {
    background: var(--rn-ice);
}

.rn-help-main {
    position: relative;
    overflow: hidden;
    padding: clamp(76px, 8vw, 116px) 0 clamp(90px, 10vw, 140px);
    background:
        radial-gradient(circle at 88% 8%, rgba(1,102,255,.075), transparent 26rem),
        radial-gradient(circle at 7% 32%, rgba(87,214,195,.10), transparent 24rem),
        var(--rn-ice);
}

.rn-help-shell {
    position: relative;
    z-index: 1;
    max-width: 1120px;
}

.rn-help-breadcrumbs {
    margin: 0 0 clamp(28px, 4vw, 46px);
    color: #607287;
    font: 700 12px/1.4 var(--rn-font-ui);
}

.rn-help-breadcrumbs ol {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rn-help-breadcrumbs li {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.rn-help-breadcrumbs li:not(:last-child)::after {
    content: "›";
    color: #A4B1BF;
}

.rn-help-breadcrumbs a {
    text-decoration: none;
    transition: color .18s ease;
}

.rn-help-breadcrumbs a:hover,
.rn-help-breadcrumbs a:focus-visible {
    color: var(--rn-blue);
}

.rn-help-breadcrumbs a:focus-visible,
.rn-help-card:focus-visible,
.rn-help-list-item:focus-visible,
.rn-help-adjacent-link:focus-visible,
.rn-help-aside-card a:focus-visible {
    outline: 3px solid rgba(1,102,255,.22);
    outline-offset: 4px;
    border-radius: 12px;
}

.rn-help-hero {
    max-width: 800px;
    margin-bottom: clamp(34px, 5vw, 58px);
}

.rn-help-hero--home {
    max-width: 880px;
    margin-bottom: clamp(44px, 6vw, 70px);
}

.rn-help-eyebrow,
.rn-help-kicker,
.rn-help-step-label,
.rn-help-aside-label {
    margin: 0 0 12px;
    color: var(--rn-blue);
    font: 800 11px/1.2 var(--rn-font-ui);
    letter-spacing: .12em;
    text-transform: uppercase;
}

.rn-help-hero h1 {
    margin: 0;
    color: var(--rn-ink);
    font-family: var(--rn-font-heavy);
    font-size: clamp(42px, 5.8vw, 72px);
    line-height: 1.02;
    letter-spacing: -.045em;
    text-wrap: balance;
}

.rn-help-lead {
    max-width: 700px;
    margin: 22px 0 0;
    color: #53677D;
    font-size: clamp(18px, 2vw, 22px);
    line-height: 1.55;
    text-wrap: pretty;
}

.rn-help-intro {
    max-width: 780px;
    margin: -22px 0 clamp(42px, 6vw, 72px);
    color: #53677D;
    font-size: 17px;
}

.rn-help-section {
    margin-top: clamp(42px, 6vw, 72px);
}

.rn-help-section-heading {
    max-width: 700px;
    margin-bottom: 24px;
}

.rn-help-section-heading h2 {
    margin: 0;
    color: var(--rn-ink);
    font-family: var(--rn-font-heavy);
    font-size: clamp(28px, 3.4vw, 40px);
    line-height: 1.08;
    letter-spacing: -.035em;
}

.rn-help-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.rn-help-card {
    position: relative;
    min-height: 220px;
    padding: clamp(24px, 3vw, 34px);
    border: 1px solid rgba(0,22,52,.09);
    border-radius: 24px;
    background: rgba(255,255,255,.92);
    box-shadow: 0 14px 42px rgba(0,22,52,.055);
    color: var(--rn-ink);
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.rn-help-card:hover {
    transform: translateY(-3px);
    border-color: rgba(1,102,255,.22);
    box-shadow: 0 18px 48px rgba(0,22,52,.085);
}

.rn-help-card-mark {
    position: absolute;
    top: 24px;
    right: 24px;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 50%;
    background: var(--rn-aqua-soft);
    color: var(--rn-ink);
    font: 800 18px/1 var(--rn-font-ui);
}

.rn-help-card h3 {
    max-width: calc(100% - 48px);
    margin: 0 0 14px;
    font-family: var(--rn-font-heavy);
    font-size: clamp(22px, 2.4vw, 30px);
    line-height: 1.12;
    letter-spacing: -.025em;
}

.rn-help-card p {
    max-width: 46ch;
    margin: 0 0 26px;
    color: #627489;
    font-size: 15px;
    line-height: 1.55;
}

.rn-help-card-link {
    position: absolute;
    bottom: 28px;
    left: clamp(24px, 3vw, 34px);
    color: var(--rn-blue);
    font: 800 12px/1.2 var(--rn-font-ui);
}

.rn-help-empty {
    padding: 34px;
    border: 1px dashed #C9D6E1;
    border-radius: 22px;
    background: rgba(255,255,255,.55);
    color: #607287;
}

.rn-help-empty p { margin: 0; }

.rn-help-layout {
    display: grid;
    grid-template-columns: minmax(0, 760px) minmax(220px, 1fr);
    gap: clamp(34px, 5vw, 74px);
    align-items: start;
}

.rn-help-article {
    min-width: 0;
}

.rn-help-content {
    color: #42576E;
    font-size: 17px;
    line-height: 1.72;
}

.rn-help-content > * {
    max-width: 720px;
}

.rn-help-content > .alignwide,
.rn-help-content > .wp-block-image,
.rn-help-content > .wp-block-video,
.rn-help-content > .wp-block-gallery,
.rn-help-content > .rn-help-step,
.rn-help-content > .rn-help-callout {
    max-width: 760px;
}

.rn-help-content h2,
.rn-help-content h3,
.rn-help-content h4 {
    color: var(--rn-ink);
    font-family: var(--rn-font-heavy);
    letter-spacing: -.025em;
}

.rn-help-content h2 {
    margin: 58px 0 15px;
    font-size: clamp(28px, 3.2vw, 38px);
    line-height: 1.14;
}

.rn-help-content h3 {
    margin: 38px 0 12px;
    font-size: clamp(21px, 2.4vw, 27px);
    line-height: 1.2;
}

.rn-help-content p,
.rn-help-content ul,
.rn-help-content ol {
    margin-top: 0;
    margin-bottom: 22px;
}

.rn-help-content a {
    color: var(--rn-blue);
    font-weight: 700;
    text-underline-offset: 3px;
}

.rn-help-content strong { color: var(--rn-ink); }

.rn-help-content .wp-block-image,
.rn-help-content .wp-block-video,
.rn-help-content figure {
    margin-top: 28px;
    margin-bottom: 32px;
}

.rn-help-content .wp-block-image img,
.rn-help-content .wp-block-video video,
.rn-help-content figure img,
.rn-help-content figure video {
    display: block;
    width: 100%;
    height: auto;
    overflow: hidden;
    border: 1px solid rgba(0,22,52,.12);
    border-radius: 18px;
    background: #EAF0F4;
    box-shadow: 0 16px 48px rgba(0,22,52,.07);
}

.rn-help-content figcaption {
    margin-top: 9px;
    color: #7B8998;
    font: 600 12px/1.5 var(--rn-font-ui);
    text-align: left;
}

.rn-help-step {
    margin: 32px 0;
    padding: clamp(24px, 4vw, 36px);
    border: 1px solid rgba(0,22,52,.09);
    border-radius: 24px;
    background: rgba(255,255,255,.95);
    box-shadow: 0 14px 44px rgba(0,22,52,.055);
}

.rn-help-step .rn-help-step-label {
    margin-bottom: 10px;
    color: #0C7B71;
}

.rn-help-step h2,
.rn-help-step h3 {
    margin-top: 0;
}

.rn-help-step > *:last-child,
.rn-help-callout > *:last-child {
    margin-bottom: 0;
}

.rn-help-callout {
    position: relative;
    margin: 34px 0;
    padding: 24px 26px 24px 66px;
    border-radius: 18px;
}

.rn-help-callout::before {
    position: absolute;
    top: 24px;
    left: 24px;
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    border-radius: 50%;
    font: 900 14px/1 var(--rn-font-ui);
}

.rn-help-callout--result {
    border: 1px solid rgba(16,137,119,.20);
    background: #EAF9F5;
}

.rn-help-callout--result::before {
    content: "✓";
    background: #CFF2E9;
    color: #087665;
}

.rn-help-callout--note {
    border: 1px solid rgba(199,139,0,.22);
    background: #FFF8E8;
}

.rn-help-callout--note::before {
    content: "!";
    background: #FFE9A9;
    color: #725000;
}

.rn-help-callout h3 {
    margin: 0 0 6px;
    color: var(--rn-ink);
    font-size: 18px;
}

.rn-help-callout p {
    margin: 0;
    color: #4E6277;
    font-size: 15px;
}

/* Add this class to a core Video block when it is a short, single-action aid. */
.rn-help-content .rn-help-microvideo {
    max-width: 620px;
}

.rn-help-content .rn-help-microvideo video {
    background: #EDF2F5;
}

.rn-help-section--children {
    margin-top: 50px;
}

.rn-help-list {
    overflow: hidden;
    border: 1px solid rgba(0,22,52,.09);
    border-radius: 20px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 12px 38px rgba(0,22,52,.045);
}

.rn-help-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 88px;
    padding: 20px 22px;
    color: var(--rn-ink);
    text-decoration: none;
    transition: background-color .18s ease;
}

.rn-help-list-item + .rn-help-list-item {
    border-top: 1px solid rgba(0,22,52,.07);
}

.rn-help-list-item:hover {
    background: #F8FBFC;
}

.rn-help-list-item strong {
    display: block;
    font-family: var(--rn-font-heavy);
    font-size: 17px;
    line-height: 1.3;
}

.rn-help-list-item small {
    display: block;
    margin-top: 5px;
    color: #687A8D;
    font-size: 13px;
    line-height: 1.45;
}

.rn-help-list-arrow {
    flex: 0 0 auto;
    color: var(--rn-blue);
    font: 900 20px/1 var(--rn-font-ui);
}

.rn-help-aside {
    position: sticky;
    top: 28px;
}

.rn-help-aside-card {
    padding: 22px;
    border: 1px solid rgba(0,22,52,.09);
    border-radius: 18px;
    background: rgba(255,255,255,.86);
}

.rn-help-aside-label {
    color: #687A8D;
}

.rn-help-aside-card a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 0;
    color: var(--rn-ink);
    font: 800 13px/1.25 var(--rn-font-ui);
    text-decoration: none;
}

.rn-help-aside-card a + a {
    border-top: 1px solid rgba(0,22,52,.07);
}

.rn-help-aside-card a span {
    color: var(--rn-blue);
}

.rn-help-adjacent {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 58px;
    padding-top: 28px;
    border-top: 1px solid rgba(0,22,52,.10);
}

.rn-help-adjacent-link {
    display: flex;
    min-height: 100px;
    flex-direction: column;
    justify-content: center;
    padding: 18px 20px;
    border: 1px solid rgba(0,22,52,.09);
    border-radius: 16px;
    background: rgba(255,255,255,.84);
    color: var(--rn-ink);
    text-decoration: none;
    transition: border-color .18s ease, transform .18s ease;
}

.rn-help-adjacent-link:hover {
    border-color: rgba(1,102,255,.22);
    transform: translateY(-2px);
}

.rn-help-adjacent-link > span {
    margin-bottom: 7px;
    color: #718296;
    font: 700 11px/1.2 var(--rn-font-ui);
    text-transform: uppercase;
    letter-spacing: .09em;
}

.rn-help-adjacent-link strong {
    font-family: var(--rn-font-heavy);
    font-size: 15px;
    line-height: 1.35;
}

.rn-help-adjacent-link--next {
    text-align: right;
}

@media (max-width: 900px) {
    .rn-help-layout {
        grid-template-columns: 1fr;
        gap: 42px;
    }
    .rn-help-aside {
        position: static;
    }
    .rn-help-aside-card {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0 22px;
    }
    .rn-help-aside-label {
        grid-column: 1 / -1;
    }
    .rn-help-aside-card a + a {
        border-top: 0;
    }
}

@media (max-width: 680px) {
    .rn-help-main {
        padding: 58px 0 88px;
    }
    .rn-help-card-grid {
        grid-template-columns: 1fr;
    }
    .rn-help-card {
        min-height: 200px;
    }
    .rn-help-layout {
        gap: 34px;
    }
    .rn-help-content {
        font-size: 16px;
    }
    .rn-help-step {
        margin: 24px 0;
        padding: 22px 20px;
        border-radius: 19px;
    }
    .rn-help-callout {
        padding: 20px 20px 20px 58px;
    }
    .rn-help-callout::before {
        top: 20px;
        left: 20px;
    }
    .rn-help-adjacent {
        grid-template-columns: 1fr;
    }
    .rn-help-aside-card {
        grid-template-columns: 1fr;
    }
    .rn-help-aside-card a + a {
        border-top: 1px solid rgba(0,22,52,.07);
    }
}

@media (prefers-reduced-motion: reduce) {
    .rn-help-card,
    .rn-help-list-item,
    .rn-help-adjacent-link {
        transition: none;
    }
    .rn-help-card:hover,
    .rn-help-adjacent-link:hover {
        transform: none;
    }
    .rn-help-content .rn-help-microvideo video {
        animation: none !important;
    }
}

/* ================================================================
 * CUSTOMER-ENABLEMENT-01D — App-Mirrored Help Navigation
 * Help navigation intentionally mirrors the customer-facing Rainnum sidebar.
 * Existing commercial page styles remain untouched.
 * ================================================================ */
.rn-body--help .rn-site-footer { margin-top: 0; }
.rn-help-main {
    overflow: visible;
    padding: 0;
    background: #F5F8FA;
}
.rn-help-app-shell {
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
    width: min(1480px, 100%);
    min-height: calc(100vh - 82px);
    margin: 0 auto;
    background: #F5F8FA;
}
.rn-help-app-sidebar {
    position: sticky;
    top: 0;
    align-self: start;
    min-height: calc(100vh - 82px);
    padding: 26px 18px 22px;
    background: #071B36;
    color: #EAF3FA;
}
.rn-help-app-sidebar-head {
    display: block;
    padding: 4px 14px 22px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    border-radius: 10px 10px 0 0;
    color: inherit;
    text-decoration: none;
}
.rn-help-app-sidebar-head:hover strong,
.rn-help-app-sidebar-head:focus-visible strong,
.rn-help-app-sidebar-head.is-active strong { color: #57D6C3; }
.rn-help-app-sidebar-head:focus-visible { outline: 2px solid #57D6C3; outline-offset: 3px; }
.rn-help-app-sidebar-head strong,
.rn-help-app-sidebar-head small { display: block; }
.rn-help-app-sidebar-head strong {
    color: #fff;
    font: 800 16px/1.25 var(--rn-font-ui);
}
.rn-help-app-sidebar-head small {
    margin-top: 5px;
    color: #91A8BD;
    font: 600 11px/1.35 var(--rn-font-ui);
}
.rn-help-app-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 7px 2px 0;
    border-radius: 50%;
    background: #57D6C3;
}
.rn-help-app-menu { padding: 17px 0; }
.rn-help-app-menu-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 46px;
    margin: 3px 0;
    padding: 0 13px;
    border-radius: 10px;
    color: #DCE8F1;
    font: 760 13px/1.2 var(--rn-font-ui);
    text-decoration: none;
    transition: background-color .16s ease, color .16s ease;
}
.rn-help-app-menu-item:hover,
.rn-help-app-menu-item:focus-visible {
    background: rgba(87,214,195,.09);
    color: #fff;
}
.rn-help-app-menu-item.is-active {
    background: #123C50;
    color: #57D6C3;
}
.rn-help-app-menu-item:focus-visible {
    outline: 2px solid rgba(87,214,195,.48);
    outline-offset: 2px;
}
.rn-help-app-menu-icon {
    display: grid;
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    place-items: center;
}
.rn-help-app-menu-icon svg { width: 19px; height: 19px; }
.rn-help-app-sidebar-foot {
    margin-top: 8px;
    padding: 18px 13px 0;
    border-top: 1px solid rgba(255,255,255,.08);
}
.rn-help-app-sidebar-foot a {
    color: #91A8BD;
    font: 700 11px/1.3 var(--rn-font-ui);
    text-decoration: none;
}
.rn-help-app-sidebar-foot a:hover { color: #fff; }
.rn-help-app-content {
    min-width: 0;
    padding: clamp(58px, 6vw, 88px) clamp(28px, 6vw, 84px) clamp(88px, 8vw, 120px);
    background:
        radial-gradient(circle at 100% 0, rgba(1,102,255,.06), transparent 27rem),
        #F5F8FA;
}
.rn-help-mobile-menu { display: none; }
.rn-help-app-hero {
    max-width: 820px;
    margin-bottom: 34px;
}
.rn-help-app-hero h1 {
    margin: 0;
    color: var(--rn-ink);
    font-family: var(--rn-font-heavy);
    font-size: clamp(40px, 5vw, 66px);
    line-height: 1.02;
    letter-spacing: -.045em;
    text-wrap: balance;
}
.rn-help-app-hero .rn-help-lead {
    max-width: 760px;
    margin-top: 18px;
    font-size: clamp(16px, 1.7vw, 20px);
}
.rn-help-screen-article { max-width: 900px; }
.rn-help-accordion-stack { max-width: 900px; }
.rn-help-accordion-stack > p:first-child,
.rn-help-accordion-stack > .rn-help-screen-intro {
    max-width: 780px;
    margin: 0 0 28px;
    color: #53677D;
    font-size: 16px;
    line-height: 1.65;
}
.rn-help-content > details.rn-help-accordion {
    max-width: 900px;
}
details.rn-help-accordion {
    overflow: hidden;
    margin: 0 0 14px;
    border: 1px solid rgba(0,22,52,.09);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 32px rgba(0,22,52,.04);
    scroll-margin-top: 24px;
}
details.rn-help-accordion[open] {
    border-color: rgba(1,102,255,.17);
    box-shadow: 0 16px 42px rgba(0,22,52,.065);
}
details.rn-help-accordion > summary {
    position: relative;
    display: flex;
    min-height: 76px;
    align-items: center;
    padding: 21px 62px 21px 24px;
    color: var(--rn-ink);
    cursor: pointer;
    font: 800 17px/1.3 var(--rn-font-ui);
    list-style: none;
    user-select: none;
}
details.rn-help-accordion > summary::-webkit-details-marker { display: none; }
details.rn-help-accordion > summary::after {
    content: "+";
    position: absolute;
    top: 50%;
    right: 22px;
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 50%;
    background: #E8F8F4;
    color: #0B776A;
    font: 800 20px/1 var(--rn-font-ui);
    transform: translateY(-50%);
    transition: transform .16s ease, background-color .16s ease;
}
details.rn-help-accordion[open] > summary::after {
    content: "−";
    background: #EAF2FF;
    color: #0166FF;
}
details.rn-help-accordion > summary:hover { background: #FBFDFE; }
details.rn-help-accordion > summary:focus-visible {
    outline: 3px solid rgba(1,102,255,.18);
    outline-offset: -3px;
}
.rn-help-accordion-body {
    padding: 0 24px 28px;
    border-top: 1px solid rgba(0,22,52,.065);
    color: #4A5F75;
    font-size: 15px;
    line-height: 1.7;
}
.rn-help-accordion-body > :first-child { margin-top: 24px; }
.rn-help-accordion-body > :last-child { margin-bottom: 0; }
.rn-help-accordion-body h3,
.rn-help-accordion-body h4 {
    margin: 28px 0 10px;
    color: var(--rn-ink);
    font-family: var(--rn-font-heavy);
    letter-spacing: -.02em;
}
.rn-help-accordion-body h3 { font-size: 22px; }
.rn-help-accordion-body h4 { font-size: 17px; }
.rn-help-accordion-body p,
.rn-help-accordion-body ul,
.rn-help-accordion-body ol { margin: 0 0 18px; }
.rn-help-accordion-body strong { color: var(--rn-ink); }
.rn-help-accordion-body .rn-help-microvideo {
    max-width: 620px;
    margin: 22px 0 12px;
}
.rn-help-accordion-body .rn-help-microvideo video {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid rgba(0,22,52,.10);
    border-radius: 15px;
    background: #EDF2F5;
    box-shadow: 0 12px 34px rgba(0,22,52,.06);
}
.rn-help-accordion-body .rn-help-microvideo figcaption {
    margin-top: 8px;
    color: #7B8998;
    font: 600 11px/1.45 var(--rn-font-ui);
}
.rn-help-mini-steps {
    display: grid;
    gap: 10px;
    margin: 20px 0;
    padding: 0;
    counter-reset: rn-help-mini;
    list-style: none;
}
.rn-help-mini-steps li {
    position: relative;
    min-height: 38px;
    padding: 8px 0 8px 45px;
    color: #4A5F75;
}
.rn-help-mini-steps li::before {
    counter-increment: rn-help-mini;
    content: counter(rn-help-mini);
    position: absolute;
    left: 0;
    top: 5px;
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 9px;
    background: #E8F8F4;
    color: #0B776A;
    font: 800 12px/1 var(--rn-font-ui);
}
.rn-help-inline-result,
.rn-help-inline-note {
    margin: 20px 0 0;
    padding: 15px 17px;
    border-radius: 13px;
}
.rn-help-inline-result { border: 1px solid rgba(16,137,119,.18); background: #EAF9F5; }
.rn-help-inline-note { border: 1px solid rgba(199,139,0,.20); background: #FFF8E8; }
.rn-help-inline-result strong,
.rn-help-inline-note strong { display: inline; }
.rn-help-screen-footer {
    max-width: 900px;
    margin-top: 38px;
    padding-top: 24px;
    border-top: 1px solid rgba(0,22,52,.08);
    color: #78899A;
    font: 600 12px/1.55 var(--rn-font-ui);
}
.rn-help-screen-footer p { margin: 0; }

@media (max-width: 980px) {
    .rn-help-app-shell { grid-template-columns: 230px minmax(0,1fr); }
    .rn-help-app-sidebar { padding-inline: 12px; }
    .rn-help-app-menu-item { padding-inline: 10px; font-size: 12px; }
    .rn-help-app-content { padding-inline: 34px; }
}

@media (max-width: 760px) {
    .rn-help-app-shell { display: block; min-height: 0; }
    .rn-help-app-sidebar { display: none; }
    .rn-help-app-content { padding: 28px 18px 78px; }
    .rn-help-mobile-menu {
        display: block;
        margin: 0 0 34px;
        border: 1px solid rgba(0,22,52,.10);
        border-radius: 15px;
        background: #fff;
    }
    .rn-help-mobile-menu > summary {
        padding: 15px 17px;
        color: var(--rn-ink);
        cursor: pointer;
        font: 800 14px/1.2 var(--rn-font-ui);
        list-style: none;
    }
    .rn-help-mobile-menu > summary::-webkit-details-marker { display: none; }
    .rn-help-mobile-menu > summary span { margin-right: 8px; color: #0166FF; }
    .rn-help-mobile-menu nav {
        display: grid;
        padding: 6px 10px 12px;
        border-top: 1px solid rgba(0,22,52,.07);
    }
    .rn-help-mobile-menu nav a {
        display: flex;
        align-items: center;
        gap: 10px;
        min-height: 44px;
        padding: 0 10px;
        border-radius: 9px;
        color: #42576E;
        font: 750 13px/1.2 var(--rn-font-ui);
        text-decoration: none;
    }
    .rn-help-mobile-menu nav a.is-active { background: #EAF8F5; color: #087665; }
    .rn-help-mobile-menu nav a.rn-help-mobile-intro {
        margin-bottom: 6px;
        border-bottom: 1px solid rgba(0,22,52,.07);
        border-radius: 0;
        color: #087665;
    }
    .rn-help-mobile-menu nav a.rn-help-mobile-intro.is-active { background: #EAF8F5; border-radius: 9px; }
    .rn-help-app-hero { margin-bottom: 28px; }
    .rn-help-app-hero h1 { font-size: clamp(36px, 11vw, 50px); }
    details.rn-help-accordion > summary { min-height: 68px; padding: 18px 56px 18px 18px; font-size: 15px; }
    details.rn-help-accordion > summary::after { right: 17px; }
    .rn-help-accordion-body { padding: 0 18px 23px; }
}

@media (prefers-reduced-motion: reduce) {
    .rn-help-app-menu-item,
    details.rn-help-accordion > summary::after { transition: none; }
}

/* ================================================================
 * CUSTOMER-ENABLEMENT-01D.1 — Edge-aligned help + real invoice flow
 * The sidebar belongs to the viewport edge; only the reading column is narrow.
 * ================================================================ */
@media (min-width: 761px) {
    .rn-help-app-shell {
        width: 100%;
        max-width: none;
        margin: 0;
    }
}

.rn-help-accordion-body .rn-help-screenshot {
    max-width: 820px;
    margin: 24px 0 14px;
}
.rn-help-accordion-body .rn-help-screenshot img {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid rgba(0,22,52,.10);
    border-radius: 15px;
    background: #EDF2F5;
    box-shadow: 0 12px 34px rgba(0,22,52,.06);
}
.rn-help-accordion-body .rn-help-screenshot figcaption {
    margin-top: 8px;
    color: #7B8998;
    font: 600 11px/1.45 var(--rn-font-ui);
}


/* ================================================================
 * CUSTOMER-ENABLEMENT-01D.1.1 — Help header brand alignment
 * On Help Center pages the app-mirrored sidebar starts at the viewport edge,
 * so the Rainnum brand in the public header follows the same left edge rather
 * than the commercial site's centered container. Other public pages unchanged.
 * ================================================================ */
@media (min-width: 761px) {
    .rn-body--help .rn-site-header .rn-header-inner {
        width: 100%;
        max-width: none;
        margin-inline: 0;
        padding-inline: 24px;
        box-sizing: border-box;
    }
}

/* ================================================================
 * CUSTOMER-ENABLEMENT-01D.15 — Public Help access + smart Help search
 * ================================================================ */
.rn-header-actions {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
}
.rn-header-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 9px 8px 8px;
    color: #DCE8F1;
    font: 750 13px/1 var(--rn-font-ui);
    text-decoration: none;
    text-underline-offset: 5px;
    transition: color .18s ease, transform .18s ease;
}
.rn-header-help:hover { color: var(--rn-aqua-master); transform: translateY(-1px); }
.rn-header-help:focus-visible {
    outline: 3px solid rgba(172,229,226,.72);
    outline-offset: 4px;
    border-radius: 7px;
}

.rn-help-search {
    max-width: 900px;
    margin: 0 0 32px;
    padding: 20px;
    border: 1px solid rgba(1,102,255,.15);
    border-radius: 18px;
    background: linear-gradient(135deg, #FFFFFF 0%, #F4FBFA 100%);
    box-shadow: 0 12px 34px rgba(0,22,52,.045);
}
.rn-help-search-heading {
    display: grid;
    grid-template-columns: minmax(220px,.72fr) minmax(280px,1fr);
    gap: 26px;
    align-items: end;
    margin-bottom: 15px;
}
.rn-help-search-heading h2 {
    margin: 3px 0 0;
    color: var(--rn-ink);
    font: 800 24px/1.15 var(--rn-font-ui);
    letter-spacing: -.025em;
}
.rn-help-search-heading > p {
    margin: 0;
    color: #607489;
    font: 500 13px/1.55 var(--rn-font-ui);
}
.rn-help-search-kicker {
    margin: 0;
    color: #087665;
    font: 800 10px/1.2 var(--rn-font-ui);
    letter-spacing: .13em;
}
.rn-help-search-form { margin: 0; }
.rn-help-search-control {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    overflow: hidden;
    min-height: 54px;
    border: 1px solid rgba(0,22,52,.13);
    border-radius: 13px;
    background: #fff;
    box-shadow: inset 0 1px 0 rgba(0,22,52,.02);
}
.rn-help-search-control:focus-within {
    border-color: #57D6C3;
    box-shadow: 0 0 0 3px rgba(87,214,195,.15);
}
.rn-help-search-icon {
    padding-left: 17px;
    color: #087665;
    font: 800 23px/1 var(--rn-font-ui);
    transform: rotate(-18deg);
}
.rn-help-search-control input {
    width: 100%;
    min-width: 0;
    min-height: 52px;
    padding: 0 14px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--rn-ink);
    font: 600 15px/1.35 var(--rn-font-ui);
}
.rn-help-search-control input::placeholder { color: #8B9AAA; font-weight: 500; }
.rn-help-search-control button {
    align-self: stretch;
    min-width: 96px;
    margin: 5px;
    padding: 0 18px;
    border: 0;
    border-radius: 10px;
    background: #071B36;
    color: #fff;
    cursor: pointer;
    font: 800 13px/1 var(--rn-font-ui);
}
.rn-help-search-control button:hover { background: #123C50; }
.rn-help-search-control button:focus-visible { outline: 3px solid rgba(1,102,255,.25); outline-offset: 2px; }
.rn-help-search-results {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid rgba(0,22,52,.08);
}
.rn-help-search-status {
    margin: 0 0 10px;
    color: #53677D;
    font: 600 12px/1.5 var(--rn-font-ui);
}
.rn-help-search-list { display: grid; gap: 8px; }
.rn-help-search-result {
    position: relative;
    display: grid;
    gap: 3px;
    padding: 13px 48px 13px 15px;
    border: 1px solid rgba(0,22,52,.08);
    border-radius: 12px;
    background: #fff;
    color: #42576E;
    text-decoration: none;
    transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.rn-help-search-result:hover {
    border-color: rgba(1,102,255,.22);
    box-shadow: 0 8px 20px rgba(0,22,52,.055);
    transform: translateY(-1px);
}
.rn-help-search-result:focus-visible { outline: 3px solid rgba(1,102,255,.20); outline-offset: 2px; }
.rn-help-search-result-section {
    color: #087665;
    font: 800 10px/1.3 var(--rn-font-ui);
    letter-spacing: .035em;
    text-transform: uppercase;
}
.rn-help-search-result strong {
    color: var(--rn-ink);
    font: 800 14px/1.35 var(--rn-font-ui);
}
.rn-help-search-result-excerpt {
    overflow: hidden;
    color: #6A7C8E;
    font: 500 12px/1.45 var(--rn-font-ui);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.rn-help-search-result-arrow {
    position: absolute;
    top: 50%;
    right: 17px;
    color: #0166FF;
    font: 800 18px/1 var(--rn-font-ui);
    transform: translateY(-50%);
}

@media (max-width: 680px) {
    .rn-header-actions { gap: 4px; }
    .rn-header-help { min-height: 36px; padding-inline: 7px; font-size: 12px; }
    .rn-help-search { padding: 16px; }
    .rn-help-search-heading { display: block; }
    .rn-help-search-heading > p { margin-top: 8px; }
    .rn-help-search-heading h2 { font-size: 21px; }
    .rn-help-search-control { grid-template-columns: auto minmax(0,1fr); }
    .rn-help-search-control button { grid-column: 1 / -1; min-height: 42px; margin: 0 5px 5px; }
    .rn-help-search-control input { min-height: 48px; padding-right: 10px; font-size: 14px; }
    .rn-help-search-icon { padding-left: 14px; }
}