/* Reesponder Design - generated by build.mjs; edit source modules. */
/* core/tokens.css */
:root {
    --page: #f5f5f2;
    --white: #ffffff;
    --black: #0b0b0b;
    --ink: #131313;
    --blue: #3aa9ed;
    --widget-blue: #1769ff;
    --widget-header: #102d50;
    --widget-ink: #121920;
    --widget-muted: #7a838d;
    --widget-line: #e6e9ed;
    --hero-radius: 32px;
    --header-height: 82px;
}


:root {
 --rd-font: Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
 --rd-paper:#f5f5f2; --rd-surface:#fff; --rd-ink:#131313; --rd-muted:#575d64;
 --rd-line:#dcdedb; --rd-accent:#167bb5; --rd-navy:#102d50;
 --rd-radius:16px; --rd-radius-large:28px; --rd-shell:1200px;
 --rd-gutter:clamp(20px,4vw,64px); --rd-section:clamp(64px,8vw,120px);
 --rd-space-1:4px; --rd-space-2:8px; --rd-space-3:12px; --rd-space-4:16px;
 --rd-space-5:24px; --rd-space-6:32px; --rd-space-7:48px; --rd-space-8:64px;
 --rd-shadow:0 12px 36px #102d500c;
}

/* core/base.css */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    min-width: 320px;
    background: var(--page);
    color: var(--ink);
    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Helvetica,
        Arial,
        sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

img {
    display: block;
}

a {
    color: inherit;
}

button,
input,
textarea,
select {
    font: inherit;
}


html{color-scheme:light;scroll-padding-top:24px}
body{font-family:var(--rd-font);line-height:1.6}
button,a,input,textarea,select,summary{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid var(--rd-accent);outline-offset:4px}
button{cursor:pointer} button:disabled{cursor:not-allowed;opacity:.5}
img,svg,video{max-width:100%} main{width:100%}
.rd-shell{width:min(var(--rd-shell),calc(100% - var(--rd-gutter)*2));margin-inline:auto}
.rd-section{padding-block:var(--rd-section)}
.rd-title{font-size:clamp(34px,4.8vw,64px);line-height:1.07;letter-spacing:-.045em;font-weight:650;margin:0 0 24px;text-wrap:balance}
.rd-lead{font-size:clamp(17px,1.6vw,21px);line-height:1.65;color:var(--rd-muted);max-width:65ch}
.rd-prose{max-width:70ch;font-size:18px;line-height:1.8}
.rd-prose h2{font-size:clamp(26px,3vw,36px);line-height:1.2;letter-spacing:-.025em;margin:48px 0 16px}
.rd-prose h3{font-size:22px;line-height:1.3;margin:32px 0 12px}
.rd-prose a{text-decoration-thickness:1px;text-underline-offset:4px;color:var(--rd-accent)}
.rd-prose li+li{margin-top:8px}.rd-prose blockquote{margin:32px 0;padding:4px 0 4px 24px;border-left:3px solid var(--rd-accent)}
.rd-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,88px);align-items:center}
.rd-media{display:block;width:100%;border:1px solid var(--rd-line);border-radius:var(--rd-radius-large)}
.rd-surface{background:var(--rd-surface);border:1px solid var(--rd-line);border-radius:var(--rd-radius);padding:clamp(24px,4vw,40px)}
.rd-caption{font-size:14px;line-height:1.5;color:var(--rd-muted);margin:12px 0 0}
.rd-inverse{background:var(--rd-navy);color:#fff;--rd-muted:#c9d5e1;--rd-line:#ffffff30;--rd-surface:#173858;--rd-accent:#8ed2fa}
.rd-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:900px){.rd-split{grid-template-columns:1fr}.rd-prose{font-size:17px}.rd-surface{border-radius:20px}}

/* components/header/header-desktop.css */
.site-header {
    position: relative;
    z-index: 100;
    width: 100%;
    background: var(--page);
}

.header-inner {
    width: min(1480px, calc(100% - 48px));
    height: var(--header-height);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 32px;
}

.brand {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    gap: 11px;
    text-decoration: none;
}

.brand-mark {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 7px;
    background: #080808;
    overflow: hidden;
}

.brand-mark img {
    width: 27px;
    height: 27px;
    object-fit: contain;
}

.brand-name {
    font-size: 20px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -0.045em;
}

.brand-name span {
    color: var(--blue);
}

.desktop-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(28px, 3vw, 48px);
}

.desktop-nav a {
    position: relative;
    color: #262626;
    text-decoration: none;
    font-size: 15px;
    line-height: 1;
    font-weight: 500;
    white-space: nowrap;
}

.desktop-nav a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -9px;
    width: 100%;
    height: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 160ms ease;
}

.desktop-nav a:hover::after {
    transform: scaleX(1);
    transform-origin: left;
}

.header-actions {
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 12px;
}

.login-button {
    min-height: 44px;
    padding: 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(0, 0, 0, 0.22);
    border-radius: 12px;
    background: transparent;
    color: #111;
    text-decoration: none;
    font-size: 14px;
    font-weight: 650;
    transition:
        background 150ms ease,
        color 150ms ease,
        border-color 150ms ease;
}

.login-button:hover {
    background: #111;
    border-color: #111;
    color: #fff;
}

.menu-button {
    position: relative;
    display: none;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.menu-button span {
    position: absolute;
    left: 10px;
    width: 24px;
    height: 2px;
    background: #111;
    transition:
        top 160ms ease,
        transform 160ms ease;
}

.menu-button span:first-child {
    top: 17px;
}

.menu-button span:last-child {
    top: 25px;
}

.site-header.menu-open .menu-button span:first-child {
    top: 21px;
    transform: rotate(45deg);
}

.site-header.menu-open .menu-button span:last-child {
    top: 21px;
    transform: rotate(-45deg);
}

.mobile-nav {
    display: none;
}

@media (min-width: 901px) {
    .desktop-nav {
        align-self: stretch;
        gap: clamp(32px, 3vw, 50px);
    }

    .nav-item {
        position: relative;
        height: 100%;
        display: flex;
        align-items: center;
    }

    .nav-trigger {
        position: relative;
        height: 100%;
        display: inline-flex;
        align-items: center;
        gap: 9px;
        padding: 0;
        color: #1d1d1d;
    }

    .nav-trigger::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 18px;
        width: 100%;
        height: 1px;
        background: #161616;
        transform: scaleX(0);
        transform-origin: right;
        transition: transform 160ms ease;
    }

    .nav-item:hover > .nav-trigger::after,
    .nav-item:focus-within > .nav-trigger::after {
        transform: scaleX(1);
        transform-origin: left;
    }

    .nav-chevron {
        width: 7px;
        height: 7px;
        margin-top: -4px;
        border-right: 1.4px solid currentColor;
        border-bottom: 1.4px solid currentColor;
        transform: rotate(45deg);
        transform-origin: center;
        transition: transform 150ms ease;
    }

    .nav-item:hover .nav-chevron,
    .nav-item:focus-within .nav-chevron {
        transform: translateY(3px) rotate(225deg);
    }

    .nav-dropdown {
        position: absolute;
        z-index: 500;
        top: 100%;
        left: -18px;
        width: max-content;
        min-width: 270px;
        max-width: 480px;
        padding: 0;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transform: translateY(-8px);
        transform-origin: top;

        transition:
            opacity 110ms ease,
            transform 150ms cubic-bezier(.2, .8, .2, 1),
            visibility 0s linear 150ms;
    }

    .nav-item:hover .nav-dropdown,
    .nav-item:focus-within .nav-dropdown {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);

        transition:
            opacity 90ms ease,
            transform 150ms cubic-bezier(.2, .8, .2, 1),
            visibility 0s;
    }

    .nav-dropdown-panel {
        min-width: 100%;
        padding: 0;

        border: 0;
        border-top: 1px solid #cfcfca;
        border-bottom: 1px solid #d8d8d3;

        border-radius: 0;

        background: #f5f5f2;

        box-shadow:
            0 10px 18px rgba(0, 0, 0, 0.055);

        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .nav-dropdown a {
        position: relative;
        width: 100%;
        min-height: 48px;

        padding: 0 38px 0 18px;

        display: flex;
        align-items: center;

        border: 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.075);
        border-radius: 0;

        background: transparent;

        color: #202020;
        font-size: 14px;
        line-height: 1.35;
        font-weight: 500;
        letter-spacing: -0.012em;

        text-decoration: none;
        white-space: nowrap;

        transition:
            background 90ms ease,
            padding-left 110ms ease,
            color 90ms ease;
    }

    .nav-dropdown a:last-child {
        border-bottom: 0;
    }

    .nav-dropdown a::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 2px;

        background: #111;

        opacity: 0;
        transform: scaleY(0.45);

        transition:
            opacity 100ms ease,
            transform 120ms ease;
    }

    .nav-dropdown a::after {
        content: "→";
        position: absolute;
        right: 16px;
        top: 50%;

        display: block;

        color: #777;
        font-size: 14px;
        font-weight: 400;

        opacity: 0;

        transform: translate(-5px, -50%);

        transition:
            opacity 90ms ease,
            transform 120ms ease;
    }

    .nav-dropdown a:hover,
    .nav-dropdown a:focus-visible {
        padding-left: 22px;

        background: #ecece7;
        color: #090909;

        outline: none;
    }

    .nav-dropdown a:hover::before,
    .nav-dropdown a:focus-visible::before {
        opacity: 1;
        transform: scaleY(1);
    }

    .nav-dropdown a:hover::after,
    .nav-dropdown a:focus-visible::after {
        opacity: 1;
        transform: translate(0, -50%);
    }

    .brand-mark {
        width: 50px;
        height: 50px;
        flex: 0 0 50px;
        border-radius: 7px;
    }

    .brand-mark img {
        width: 39px;
        height: 39px;
    }
}
@media (min-width: 901px) {
    .desktop-nav .nav-dropdown a::after {
        left: auto;
        bottom: auto;
        right: 16px;
        top: 50%;

        width: auto;
        height: auto;

        background: none;

        transform-origin: center;
        transform: translate(-5px, -50%) !important;

        opacity: 0;
    }

    .desktop-nav .nav-dropdown a:hover::after,
    .desktop-nav .nav-dropdown a:focus-visible::after {
        transform: translate(0, -50%) !important;
        opacity: 1;
    }
}
.desktop-nav .nav-dropdown{left:-18px;transform:translateY(-8px)}
.desktop-nav .nav-item:hover .nav-dropdown,.desktop-nav .nav-item:focus-within .nav-dropdown{transform:translateY(0)}
.nav-dropdown-panel{overflow:hidden}
.nav-dropdown a:focus-visible{outline:2px solid var(--rd-accent);outline-offset:-3px}

/* components/buttons/buttons.css */
.button {
    min-height: 52px;
    padding: 0 24px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 15px;
    font-weight: 650;
    transition:
        transform 150ms ease,
        background 150ms ease,
        border-color 150ms ease;
}

.button:hover {
    transform: translateY(-1px);
}

.button-primary {
    border: 1px solid #fff;
    background: #fff;
    color: #101010;
}

.button-primary:hover {
    background: #eeeeeb;
    border-color: #eeeeeb;
}

.button-secondary {
    border: 1px solid rgba(255, 255, 255, 0.34);
    background: rgba(0, 0, 0, 0.28);
    color: #fff;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.button-secondary:hover {
    background: rgba(0, 0, 0, 0.42);
    border-color: rgba(255, 255, 255, 0.5);
}


.rd-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border:1px solid var(--rd-ink);border-radius:12px;background:var(--rd-ink);color:#fff;font:600 15px/1.3 var(--rd-font);text-decoration:none;transition:background .15s,transform .15s}
.rd-button:hover{background:#30363c;transform:translateY(-1px)}
.rd-button--secondary{background:transparent;color:var(--rd-ink);border-color:#b8bdc2}.rd-button--secondary:hover{background:#eceeeb}
.rd-inverse .rd-button{background:#fff;color:#102d50;border-color:#fff}
.rd-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}

/* components/chat-demo/chat-demo.css */
.demo-phone {
    position: relative;
    width: clamp(250px, 18.8vw, 288px);
    aspect-ratio: 9 / 19.35;
    padding: 8px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 42px;
    background:
        linear-gradient(
            145deg,
            #282b2f 0%,
            #0d0f11 38%,
            #16191c 74%,
            #2d3034 100%
        );
    box-shadow:
        0 36px 80px rgba(0, 0, 0, 0.38),
        0 10px 24px rgba(0, 0, 0, 0.22),
        inset 0 1px 1px rgba(255, 255, 255, 0.16);
}

.demo-phone::after {
    content: "";
    position: absolute;
    inset: 1px;
    border-radius: 40px;
    border: 1px solid rgba(255, 255, 255, 0.055);
    pointer-events: none;
}

.demo-phone-camera {
    position: absolute;
    z-index: 20;
    top: 14px;
    left: 50%;
    width: 72px;
    height: 22px;
    border-radius: 999px;
    background: #060708;
    transform: translateX(-50%);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.05),
        inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.demo-phone-screen {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 34px;
    background: #fff;
}

.demo-widget {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    background: #fff;
    color: var(--widget-ink);
}

.demo-widget-header {
    position: relative;
    min-height: 86px;
    padding: 39px 48px 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--widget-header);
    color: #fff;
}

.demo-widget-brand {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    line-height: 1.15;
}

.demo-widget-brand strong {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.demo-widget-brand span {
    max-width: 170px;
    margin-top: 4px;
    overflow: hidden;
    color: #cbd9e9;
    font-size: 9px;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.demo-widget-close {
    position: absolute;
    top: 55%;
    right: 10px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    color: #fff;
    transform: translateY(-50%);
}

.demo-widget-close svg {
    width: 18px;
    height: 18px;
}

.demo-powered {
    padding: 6px 12px 7px;
    background: #fff;
    color: #7b8794;
    font-size: 8px;
    line-height: 1.3;
    text-align: center;
}

.demo-powered strong {
    font-weight: 800;
}

.demo-thread {
    min-width: 0;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: none;
    padding: 15px 11px 18px;
    background: #fff;
}

.demo-thread::-webkit-scrollbar {
    display: none;
}

.demo-message {
    display: flex;
    margin: 0 0 10px;
}

.demo-message.assistant {
    justify-content: flex-start;
}

.demo-message.visitor {
    justify-content: flex-end;
}

.demo-message-inner {
    max-width: 86%;
}

.demo-meta {
    margin: 0 3px 5px;
    color: #687585;
    font-size: 8.5px;
    line-height: 1.2;
    font-weight: 600;
}

.visitor .demo-meta {
    text-align: right;
}

.demo-bubble {
    padding: 9px 10px;
    border-radius: 14px;
    font-size: 11.5px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.assistant .demo-bubble {
    border: 1px solid #edf0f3;
    border-bottom-left-radius: 5px;
    background: #f3f5f7;
    color: #222930;
}

.visitor .demo-bubble {
    border-bottom-right-radius: 5px;
    background: #1c2938;
    color: #fff;
}

.demo-suggestions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    margin: 1px 0 13px;
}

.demo-suggestions.is-hidden {
    display: none;
}

.demo-suggestions > div {
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 9px;
    border: 1px solid #dfe4ea;
    border-radius: 9px;
    background: #fafbfd;
    color: #37414c;
    font-size: 9px;
    line-height: 1.25;
    font-weight: 500;
}

.demo-suggestions span {
    color: #527095;
}

.demo-typing-message {
    animation: demo-message-in 240ms ease both;
}

.demo-typing {
    width: max-content;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 10px 11px;
    border: 1px solid #e5e8eb;
    border-radius: 14px 14px 14px 5px;
    background: #f5f6f8;
}

.demo-typing i {
    width: 5px;
    height: 5px;
    display: block;
    border-radius: 50%;
    background: #848d96;
    animation: demo-dots 1.05s infinite ease-in-out;
}

.demo-typing i:nth-child(2) {
    animation-delay: 0.14s;
}

.demo-typing i:nth-child(3) {
    animation-delay: 0.28s;
}

.demo-feedback {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 2px 0 10px 2px;
    color: #526174;
    font-size: 9.5px;
    animation: demo-message-in 260ms ease both;
}

.demo-feedback-button {
    width: 34px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 1px solid #e2e5e8;
    border-radius: 10px;
    background: #fff;
    color: #405773;
    transform: scale(1);
    transition:
        color 180ms ease,
        border-color 180ms ease,
        background 180ms ease,
        transform 180ms ease,
        box-shadow 180ms ease;
}

.demo-feedback-button svg {
    width: 17px;
    height: 17px;
}

.demo-feedback-button.negative svg {
    transform: rotate(180deg);
}

.demo-feedback-button.positive.is-clicked {
    animation: demo-like-click 520ms ease;
}

.demo-feedback-button.positive.is-selected {
    border-color: #8bcaa4;
    background: #eaf7ef;
    color: #31915a;
    box-shadow: 0 3px 10px rgba(49, 145, 90, 0.09);
}

.demo-composer-wrap {
    position: relative;
    padding-top: 1px;
    padding-bottom: 4px;
    background: #fff;
    border-top: 1px solid var(--widget-line);
}

.demo-composer {
    min-height: 48px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    align-items: end;
    gap: 6px;
    margin: 8px 8px 0;
    padding: 4px 4px 4px 14px;
    border: 1px solid #d9dee4;
    border-radius: 30px;
    background: #fff;
}

.demo-composer-input {
    position: relative;
    min-width: 0;
    min-height: 40px;
    max-height: 58px;
    padding: 10px 0 8px;
    overflow: hidden;
    color: #161c22;
    font-size: 13px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.demo-placeholder {
    position: absolute;
    top: 50%;
    left: 0;
    color: #9ba3ab;
    opacity: 1;
    transform: translateY(-50%);
    transition: opacity 120ms ease;
}

.demo-composer.has-text .demo-placeholder {
    opacity: 0;
}

.demo-composer-text {
    display: inline;
}

.demo-caret {
    width: 1px;
    height: 15px;
    margin-left: 1px;
    display: none;
    vertical-align: -2px;
    background: #161c22;
    animation: demo-caret 0.85s steps(1) infinite;
}

.demo-composer.is-typing .demo-caret {
    display: inline-block;
}

.demo-send {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    align-self: end;
    border-radius: 50%;
    background: #dce3ec;
    color: #9ba6b2;
    transition:
        background 140ms ease,
        color 140ms ease,
        transform 140ms ease;
}

.demo-send.is-ready,
.demo-send.is-sending {
    background: var(--widget-blue);
    color: #fff;
}

.demo-send.is-clicked {
    transform: scale(0.92);
}

.demo-send.is-sending svg {
    animation: demo-plane-flight 900ms ease-in-out;
}

.demo-send svg {
    width: 18px;
    height: 18px;
}

.demo-disclaimer {
    margin: 5px 8px 7px;
    color: #788493;
    font-size: 7px;
    line-height: 1.35;
    text-align: center;
}

.demo-dynamic {
    animation: demo-message-in 260ms ease both;
}

@keyframes demo-dots {
    0%,
    60%,
    100% {
        transform: none;
        opacity: 0.35;
    }

    30% {
        transform: translateY(-3px);
        opacity: 1;
    }
}

@keyframes demo-message-in {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes demo-caret {
    0%,
    48% {
        opacity: 1;
    }

    49%,
    100% {
        opacity: 0;
    }
}

@keyframes demo-plane-flight {
    0%,
    100% {
        transform: translate(0, 0) rotate(0);
    }

    35% {
        transform: translate(2px, -3px) rotate(-9deg);
    }

    70% {
        transform: translate(-1px, 1px) rotate(5deg);
    }
}

@keyframes demo-like-click {
    0% {
        transform: scale(1);
    }

    35% {
        transform: scale(1.18);
    }

    65% {
        transform: scale(0.96);
    }

    100% {
        transform: scale(1);
    }
}


.demo-suggestions>div{border-radius:999px}
.demo-control{display:block;margin:18px auto 0;border:1px solid #ffffff70;background:#0b1524b3;color:#fff;border-radius:999px;padding:8px 15px;font-size:12px;line-height:1.4;pointer-events:auto;min-height:36px}
.demo-control[hidden]{display:none}

/* components/forms/forms.css */
.rd-form{display:grid;gap:22px}.rd-field{display:grid;gap:8px}.rd-field label{font-size:15px;font-weight:600;line-height:1.4}
.rd-input{width:100%;min-height:50px;padding:12px 14px;background:var(--rd-surface);color:var(--rd-ink);border:1px solid #aeb6be;border-radius:10px;font:400 16px/1.5 var(--rd-font)}
textarea.rd-input{min-height:130px;resize:vertical}.rd-input::placeholder{color:#66717b}
.rd-input:focus{border-color:var(--rd-accent)}.rd-input[aria-invalid=true]{border-color:#aa3229}
.rd-help{margin:0;font-size:14px;color:var(--rd-muted)}.rd-error{color:#aa3229;font-size:14px;margin:0}
.rd-check{display:flex;gap:10px;align-items:flex-start;font-size:15px}.rd-check input{width:18px;height:18px;margin-top:4px;accent-color:var(--rd-accent)}
.rd-notice{padding:16px 20px;border:1px solid #bdd6e6;border-radius:12px;background:#edf6fc;color:#173e59;line-height:1.6}
.rd-notice--success{border-color:#bad8c9;background:#eff7f2;color:#27513e}.rd-notice--error{border-color:#e6c7c4;background:#fcf3f2;color:#87342d}

/* components/table/table.css */
.rd-table-wrap{overflow-x:auto;border:1px solid var(--rd-line);border-radius:16px;background:var(--rd-surface)}
.rd-table{border-collapse:collapse;width:100%;text-align:left;font-size:15px;line-height:1.5}
.rd-table caption{text-align:left;padding:20px 24px;font-weight:600;font-size:18px}
.rd-table th,.rd-table td{padding:18px 24px;border-top:1px solid var(--rd-line);vertical-align:top}
.rd-table thead th{background:#f2f4f2;font-weight:600}.rd-table tbody th{font-weight:500}
.rd-table .rd-number{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
@media(max-width:600px){.rd-table th,.rd-table td{padding:14px 16px}.rd-table{font-size:14px}}

/* components/faq/faq.css */
.rd-faq{border-top:1px solid var(--rd-line)}.rd-faq details{border-bottom:1px solid var(--rd-line)}
.rd-faq summary{list-style:none;position:relative;padding:24px 44px 24px 0;font-size:clamp(18px,2vw,22px);line-height:1.4;font-weight:550;cursor:pointer}
.rd-faq summary::-webkit-details-marker{display:none}.rd-faq summary:after{content:'+';position:absolute;right:8px;top:23px;font-size:24px;font-weight:400;color:var(--rd-muted)}
.rd-faq details[open] summary:after{content:'−'}.rd-faq details>div{max-width:68ch;padding:0 32px 24px 0;color:var(--rd-muted);font-size:17px;line-height:1.75}

/* pages/home/home-desktop.css */
.hero {
    position: relative;
    isolation: isolate;
    width: min(1920px, calc(100% - 32px));
    min-height: clamp(690px, calc(100svh - 98px), 900px);
    margin: 0 auto 16px;
    overflow: hidden;
    border-radius: var(--hero-radius);
    background-image: url("https://reesponder.com/imgs/g7.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
}

.hero::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(5, 7, 9, 0.84) 0%,
            rgba(5, 7, 9, 0.76) 19%,
            rgba(5, 7, 9, 0.55) 34%,
            rgba(5, 7, 9, 0.25) 48%,
            rgba(5, 7, 9, 0.06) 62%,
            rgba(5, 7, 9, 0) 76%
        );
    pointer-events: none;
}

.hero::after {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;
    background:
        linear-gradient(
            0deg,
            rgba(0, 0, 0, 0.18) 0%,
            rgba(0, 0, 0, 0) 34%
        );
    pointer-events: none;
}

.hero-inner {
    position: relative;
    z-index: 2;
    width: min(1480px, calc(100% - 96px));
    min-height: inherit;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 42px;
}

.hero-copy {
    width: min(650px, 50%);
    padding: 64px 0 64px clamp(24px, 2.2vw, 38px);
    color: #fff;
}

.hero-copy h1 {
    margin: 0;
    max-width: 620px;
    color: #fff;
    font-size: clamp(54px, 5vw, 80px);
    line-height: 0.99;
    letter-spacing: -0.06em;
    font-weight: 700;
}

.hero-copy h1 span {
    color: var(--blue);
}

.hero-copy p {
    max-width: 570px;
    margin: 34px 0 0;
    color: rgba(255, 255, 255, 0.8);
    font-size: clamp(16px, 1.15vw, 19px);
    line-height: 1.55;
    letter-spacing: -0.015em;
    font-weight: 400;
}

.hero-actions {
    margin-top: 36px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.hero-device {
    margin-left: auto;
    margin-right: clamp(8px, 2vw, 30px);
    flex: 0 0 auto;
    pointer-events: none;
}

@media (min-width: 1700px) {
    :root {
        --header-height: 88px;
    }

    .header-inner {
        width: min(1540px, calc(100% - 64px));
    }

    .hero-inner {
        width: min(1540px, calc(100% - 128px));
    }
}

@media (max-width: 1180px) {
    .header-inner {
        width: calc(100% - 36px);
    }

    .desktop-nav {
        gap: 24px;
    }

    .hero-inner {
        width: calc(100% - 64px);
        gap: 28px;
    }

    .hero-copy {
        width: 55%;
        padding-left: 18px;
    }

    .hero-copy h1 {
        font-size: clamp(48px, 5.7vw, 66px);
    }

    .demo-phone {
        width: 246px;
    }
}

@media (min-width: 1181px) {
    .hero-copy {
        transform: translateX(48px);
    }

    .hero-device {
        transform: translateX(-68px);
    }
}

@media (min-width: 961px) and (max-width: 1180px) {
    .hero-copy {
        transform: translateX(24px);
    }

    .hero-device {
        transform: translateX(-30px);
    }
}

/* components/header/header-mobile.css */
@media(max-width:900px){
 :root{--header-height:72px}
 .header-inner{width:calc(100% - 40px);height:72px;grid-template-columns:1fr auto;gap:16px}
 .desktop-nav,.login-button{display:none}.menu-button{display:block}
 .brand-mark{width:40px;height:40px;flex-basis:40px}.brand-mark img{width:30px;height:30px}.brand-name{font-size:19px}
 .mobile-nav{position:absolute;left:12px;right:12px;top:calc(100% - 2px);z-index:120;padding:12px 20px 20px;background:var(--rd-paper);border:1px solid var(--rd-line);border-radius:20px;box-shadow:0 16px 36px #102d501c;max-height:calc(100dvh - 90px);overflow:auto}
 .site-header.menu-open .mobile-nav{display:block}
 .mobile-nav details{border-bottom:1px solid var(--rd-line)}
 .mobile-nav summary{padding:16px 0;cursor:pointer;font-size:17px;font-weight:600}
 .mobile-nav a{display:block;padding:12px 0;text-decoration:none;font-size:15px;line-height:1.4}
 .mobile-nav details a{padding-left:14px;color:var(--rd-muted)}
 .mobile-nav .mobile-login{margin-top:16px;border-radius:12px;background:var(--rd-ink);color:#fff;text-align:center;font-weight:600}
}

/* pages/home/home-mobile.css */
@media(max-width:960px){
 .hero{width:calc(100% - 24px);min-height:0;margin:0 auto 24px;border-radius:28px;background-position:60% top;background-size:auto 760px;background-color:#0c1620}
 .hero:before{background:linear-gradient(180deg,#06111ec9 0%,#06111edb 43%,#0c1620 72%)}
 .hero:after{display:none}
 .hero-inner{width:100%;display:flex;flex-direction:column;gap:0;padding:0 clamp(22px,5vw,48px) 36px}
 .hero-copy{width:100%;padding:48px 0 32px;transform:none}
 .hero-copy h1{max-width:690px;font-size:clamp(36px,7vw,58px);line-height:1.075;letter-spacing:-.045em;text-wrap:balance}
 .hero-copy p{max-width:58ch;margin-top:24px;font-size:16px;line-height:1.65;color:#e2e8ee;letter-spacing:0}
 .hero-actions{margin-top:28px;gap:12px;flex-wrap:wrap}
 .hero-actions .button{min-height:50px;flex:1 1 130px;padding:12px 16px;text-align:center;font-size:14px}
 .hero-device{display:block;width:100%;max-width:500px;margin:0 auto;transform:none}
 .demo-phone{width:100%;height:480px;aspect-ratio:auto;padding:0;border:1px solid #ffffff40;border-radius:23px;background:#fff;box-shadow:0 16px 36px #0003}
 .demo-phone-camera,.demo-phone:after{display:none}.demo-phone-screen{border-radius:22px}
 .demo-widget-header{min-height:68px;padding:14px 48px}.demo-widget-brand strong{font-size:16px}.demo-widget-brand span{font-size:11px}
 .demo-widget-close{top:50%}.demo-powered{font-size:10px;padding:8px 12px}
 .demo-thread{padding:16px}.demo-message{margin-bottom:14px}.demo-meta{font-size:11px}
 .demo-bubble{font-size:13px;line-height:1.55;padding:11px 13px}.demo-message-inner{max-width:91%}
 .demo-suggestions>div{font-size:12px;padding:12px}.demo-composer-wrap{padding:10px}.demo-composer{min-height:46px}.demo-composer-input{font-size:13px}.demo-disclaimer{font-size:9px;margin:7px 0 2px}
 .demo-control{margin-top:14px;background:transparent;font-size:12px;min-height:40px}
}
@media(max-width:360px){.hero-inner{padding-inline:18px}.hero-copy h1{font-size:34px}.hero-actions{flex-direction:column}.hero-actions .button{flex:auto;width:100%}.demo-thread{padding:12px}}

/* core/accessibility.css */
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
@media(forced-colors:active){.button,.rd-button,.rd-input,.rd-surface,.nav-dropdown-panel{border:1px solid ButtonText}.hero:before{background:Canvas}.hero-copy,.hero-copy h1,.hero-copy p{color:CanvasText}}
@media print{body{background:#fff;color:#000}.site-header,.hero-device,.hero-actions,.demo-control{display:none}.hero{background:none!important;min-height:0;width:100%;margin:0}.hero:before,.hero:after{display:none}.hero-inner,.hero-copy{width:100%;padding:0;transform:none}.hero-copy h1,.hero-copy p{color:#000}.rd-section{padding-block:24px}.rd-surface,.rd-table-wrap{break-inside:avoid;box-shadow:none}.rd-inverse{background:#fff;color:#000}.rd-prose{max-width:none}}
