﻿/* Mobile home-page correction */

@media (max-width: 768px) {
    .ve-hero {
        margin-bottom: 1.25rem;
        padding: 0.85rem;
        border-radius: 24px;
    }

    .hero-fluid-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .hero-logo-rush-row {
        align-items: stretch;
        flex-direction: column;
        gap: 0.9rem;
        margin-bottom: 1.1rem;
    }

    .hero-logo {
        width: min(44vw, 165px);
        margin: 0 auto 0.35rem auto;
    }

    .hero-demo-card-stack {
        width: 100%;
        max-width: 100%;
    }

    .phone-demo-card,
    .rush-demo-button,
    .why-gino-button {
        min-height: auto;
        padding: 0.9rem;
        border-radius: 22px;
    }

    .phone-demo-icon,
    .rush-demo-icon,
    .why-gino-icon {
        width: 46px;
        height: 46px;
        flex: 0 0 46px;
        font-size: 1.45rem;
    }

    .hero-title {
        font-size: clamp(2.45rem, 11vw, 3.8rem);
        line-height: 1.02;
    }

        .hero-title.hero-title-split {
            font-size: clamp(2.05rem, 8.4vw, 3.05rem);
            line-height: 1.07;
            letter-spacing: -0.048em;
        }

            .hero-title.hero-title-split span {
                white-space: normal;
            }

    .hero-subtitle {
        margin-bottom: 0.9rem;
        font-size: 1.1rem;
        line-height: 1.55;
    }

    .demo-shell {
        grid-template-columns: 1fr;
        height: auto;
    }

    .gino-stage {
        padding: 0.75rem;
        border-radius: 22px;
    }

    .gino-portrait-card {
        min-height: 610px;
        border-radius: 24px;
    }

    .gino-orb-zone {
        padding: 6.2rem 1rem 1.35rem 1rem;
    }

    .gino-orb-button {
        width: 170px;
        height: 170px;
    }

    .gino-orb-face-wrap {
        width: 72px;
        height: 72px;
    }

    .gino-orb-name {
        font-size: 2rem;
    }

    .gino-demo-only-note {
        margin-top: 0.9rem;
        max-width: 92%;
        font-size: 0.78rem;
    }

    .gino-orb-title {
        margin-top: 1.15rem;
        font-size: 1.45rem;
    }

    .gino-orb-subtitle {
        font-size: 1rem;
    }

    .gino-capability-line {
        gap: 0.35rem 0.45rem;
        margin-top: 0.85rem;
        font-size: 0.82rem;
    }

        .gino-capability-line span:not(:last-child)::after {
            margin-left: 0.45rem;
        }

    .gino-starter-chips {
        gap: 0.45rem;
        margin-top: 0.95rem;
    }

        .gino-starter-chips span {
            padding: 0.45rem 0.6rem;
            font-size: 0.72rem;
        }
}


@media (max-width: 575.98px) {
    .ve-navbar .container-fluid {
        position: relative;
        flex-wrap: nowrap;
    }

    .ve-navbar .ve-brand {
        min-width: 0;
        flex: 1 1 auto;
    }

    .ve-brand span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .ve-navbar .navbar-toggler {
        flex: 0 0 auto;
        margin-left: 0.65rem;
    }

    .ve-navbar .navbar-collapse:not(.show) {
        display: none !important;
    }

    .ve-navbar .navbar-collapse.show {
        position: absolute;
        top: calc(100% + 0.6rem);
        left: 0.75rem;
        right: 0.75rem;
        z-index: 1000;
        display: block !important;
        padding: 0.85rem 1rem;
        border: 1px solid var(--ve-border);
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.98);
        box-shadow: 0 18px 44px rgba(6, 23, 53, 0.18);
    }

    .ve-navbar .navbar-nav {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.35rem;
        width: 100%;
        white-space: normal;
    }

    .ve-navbar .nav-link {
        width: 100%;
        padding: 0.45rem 0;
    }
}

:root {
    --ve-navy: #061735;
    --ve-blue: #0b5ed7;
    --ve-bright-blue: #147cff;
    --ve-purple: #5b4bff;
    --ve-text: #152033;
    --ve-muted: #5f6b7c;
    --ve-soft: #f4f7ff;
    --ve-card: rgba(255, 255, 255, 0.94);
    --ve-border: rgba(15, 35, 75, 0.13);
    --ve-shadow: 0 24px 70px rgba(6, 23, 53, 0.14);
}

html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

body {
    min-height: 100vh;
    margin: 0;
    color: var(--ve-text);
    background: radial-gradient(circle at 12% 12%, rgba(20, 124, 255, 0.12), transparent 34%), radial-gradient(circle at 88% 18%, rgba(91, 75, 255, 0.10), transparent 30%), linear-gradient(135deg, #ffffff 0%, #f6f8ff 48%, #eef4ff 100%);
}

.site-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
}

.site-main {
    flex: 1;
}

    .site-main > .container-fluid {
        max-width: 100%;
        overflow-x: hidden;
    }

.ve-navbar {
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(16px);
}

.ve-brand {
    font-weight: 800;
    letter-spacing: 0.2px;
    color: var(--ve-navy) !important;
}

.nav-logo {
    width: 42px;
    height: auto;
}

.ve-navbar {
    min-height: 72px;
}

    .ve-navbar .ve-brand {
        font-size: 1.22rem;
    }

    .ve-navbar .navbar-collapse {
        flex-grow: 1;
    }

    .ve-navbar .navbar-nav {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: nowrap;
        gap: 1.15rem;
        white-space: nowrap;
    }

    .ve-navbar .nav-link {
        font-size: 1.05rem;
        font-weight: 600;
        padding-left: 0;
        padding-right: 0;
    }

.ve-navbar {
    min-height: 72px;
}

    .ve-navbar .ve-brand {
        font-size: 1.22rem;
    }

    .ve-navbar .nav-link {
        font-size: 1.05rem;
        font-weight: 600;
    }

@media (min-width: 576px) {
    .ve-navbar .navbar-collapse {
        flex-grow: 1;
    }

    .ve-navbar .navbar-nav {
        margin-left: auto;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: nowrap;
        gap: 1.15rem;
        white-space: nowrap;
    }

    .ve-navbar .nav-link {
        padding-left: 0;
        padding-right: 0;
    }
}

/* Main hero shell */

.ve-hero {
    position: relative;
    width: 100%;
    max-width: 1900px;
    margin: 0 auto 2rem auto;
    padding: clamp(1rem, 2.2vw, 2.6rem);
    border: 1px solid var(--ve-border);
    border-radius: clamp(18px, 1.6vw, 32px);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(245, 248, 255, 0.9)), radial-gradient(circle at 78% 20%, rgba(0, 116, 255, 0.12), transparent 36%), radial-gradient(circle at 16% 86%, rgba(107, 63, 242, 0.10), transparent 34%);
    box-shadow: var(--ve-shadow);
    overflow: hidden;
}

    .ve-hero::after {
        content: "";
        position: absolute;
        inset: auto -10% -42% 45%;
        height: 360px;
        background: radial-gradient(circle, rgba(0, 116, 255, 0.13), transparent 60%), radial-gradient(circle at 30% 70%, rgba(107, 63, 242, 0.12), transparent 56%);
        filter: blur(8px);
        pointer-events: none;
    }

.hero-fluid-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(320px, 0.85fr) minmax(620px, 1.15fr);
    gap: clamp(1rem, 2vw, 2.5rem);
    align-items: stretch;
}

.hero-copy-column,
.hero-demo-column {
    min-width: 0;
}

.hero-demo-column {
    container-type: inline-size;
    align-self: start;
}

.hero-copy {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(0.25rem, 1vw, 1rem);
}

.hero-logo {
    width: clamp(130px, 14vw, 245px);
    height: auto;
    display: block;
}

.hero-eyebrow {
    margin-bottom: 0.7rem;
    color: var(--ve-bright-blue);
    font-weight: 800;
    font-size: 0.82rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.hero-title {
    max-width: 820px;
    margin-bottom: 1rem;
    color: var(--ve-navy);
    font-size: clamp(2.2rem, 4.2vw, 5.1rem);
    line-height: 0.98;
    font-weight: 900;
    letter-spacing: -0.055em;
}

    .hero-title.hero-title-split {
        max-width: 690px;
        margin-bottom: 0.95rem;
        font-size: clamp(2.35rem, 3vw, 3.75rem);
        line-height: 1.05;
        letter-spacing: -0.052em;
    }

        .hero-title.hero-title-split span {
            display: block;
        }

            .hero-title.hero-title-split span + span {
                margin-top: 0.04em;
            }

.hero-subtitle {
    max-width: 760px;
    margin-bottom: 1.6rem;
    color: #344158;
    font-size: clamp(1.05rem, 1.5vw, 1.35rem);
    line-height: 1.65;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    align-items: center;
    margin-bottom: 0.85rem;
}

.ve-btn-primary,
.ve-btn-secondary {
    border-radius: 999px;
    padding: 0.9rem 1.35rem;
    font-weight: 800;
    box-shadow: 0 12px 30px rgba(0, 92, 191, 0.16);
}

.ve-btn-primary {
    color: #ffffff;
    border: 0;
    background: linear-gradient(135deg, var(--ve-blue), var(--ve-purple));
}

    .ve-btn-primary:hover,
    .ve-btn-primary:focus {
        color: #ffffff;
        transform: translateY(-1px);
    }

.ve-btn-secondary {
    color: var(--ve-navy);
    border: 1px solid rgba(0, 92, 191, 0.22);
    background: rgba(255, 255, 255, 0.82);
}

.hero-note {
    max-width: 620px;
    margin: 0;
    color: var(--ve-muted);
    font-size: 0.95rem;
}

/* Friday rush / multiple Ginos demo */

.hero-logo-rush-row {
    display: flex;
    align-items: center;
    gap: clamp(1rem, 1.4vw, 1.6rem);
    margin-bottom: 1.25rem;
}

    .hero-logo-rush-row .hero-logo {
        flex: 0 0 auto;
    }

.hero-demo-card-stack {
    flex: 1;
    max-width: 385px;
    display: grid;
    gap: 0.8rem;
}


.phone-demo-notice {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.78rem;
    align-items: center;
    min-height: 86px;
    padding: 0.68rem 0.2rem;
    color: var(--ve-navy);
    background: transparent;
    text-align: left;
}

.phone-demo-notice-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    color: var(--ve-bright-blue);
    background: rgba(20, 124, 255, 0.08);
    font-size: 1.45rem;
    font-weight: 900;
}

.phone-demo-notice-copy strong,
.phone-demo-notice-copy em {
    display: block;
}

.phone-demo-notice-copy strong {
    color: var(--ve-navy);
    font-size: 1.04rem;
    font-weight: 950;
    line-height: 1.08;
}

.phone-demo-notice-copy em {
    margin-top: 0.2rem;
    color: var(--ve-navy);
    font-size: clamp(1.25rem, 1.55vw, 1.72rem);
    font-style: normal;
    font-weight: 950;
    line-height: 1;
    letter-spacing: -0.045em;
}

.rush-demo-button {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.85rem;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 22px;
    padding: 0.95rem 1rem;
    color: #ffffff;
    background: linear-gradient(135deg, #005cbf 0%, #264bff 48%, #6b3ff2 100%);
    box-shadow: 0 22px 54px rgba(0, 92, 191, 0.34), 0 0 0 1px rgba(0, 116, 255, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.28);
    text-align: left;
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

    .rush-demo-button:hover,
    .rush-demo-button:focus {
        transform: translateY(-1px);
        box-shadow: 0 22px 52px rgba(0, 92, 191, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.25);
    }

.why-gino-button {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.72rem;
    border: 2px solid rgba(91, 75, 255, 0.20);
    border-radius: 20px;
    padding: 0.72rem 0.9rem;
    color: var(--ve-navy);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(239, 242, 255, 0.94));
    box-shadow: 0 14px 30px rgba(7, 26, 61, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.82);
    text-align: left;
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

    .why-gino-button:hover,
    .why-gino-button:focus {
        transform: translateY(-1px);
        border-color: rgba(91, 75, 255, 0.38);
        box-shadow: 0 18px 36px rgba(7, 26, 61, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.88);
    }

.why-gino-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    color: #ffffff;
    background: linear-gradient(135deg, var(--ve-blue), var(--ve-purple));
    box-shadow: 0 9px 18px rgba(91, 75, 255, 0.24);
    font-size: 1.12rem;
    font-weight: 950;
}

.why-gino-button strong,
.why-gino-button em {
    display: block;
}

.why-gino-button strong {
    color: var(--ve-navy);
    font-size: 1.02rem;
    font-weight: 950;
    line-height: 1.12;
}

.why-gino-button em {
    margin-top: 0.15rem;
    color: #344158;
    font-size: 0.83rem;
    font-style: normal;
    font-weight: 750;
    line-height: 1.22;
}

.why-gino-chevron {
    margin-left: auto;
    color: rgba(6, 23, 53, 0.45);
    font-size: 1.8rem;
    font-weight: 800;
    line-height: 1;
}

.rush-demo-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 22%, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0.13));
    box-shadow: 0 0 24px rgba(255, 255, 255, 0.24), inset 0 0 0 1px rgba(255, 255, 255, 0.28);
    font-size: 1.35rem;
    font-weight: 900;
}

.rush-demo-button strong,
.rush-demo-button em {
    display: block;
}

.rush-demo-button strong {
    font-size: 1.05rem;
    font-weight: 950;
    line-height: 1.15;
}

.rush-demo-button em {
    margin-top: 0.2rem;
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.84rem;
    font-style: normal;
    font-weight: 750;
    line-height: 1.25;
}

.rush-demo-chevron {
    margin-left: auto;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    transition: transform 0.2s ease;
}

.rush-demo-button[aria-expanded="true"] .rush-demo-chevron {
    transform: rotate(90deg);
}

.rush-demo-panel {
    width: min(100%, 760px);
    margin: -0.2rem 0 1.15rem 0;
    border-radius: 28px;
    padding: clamp(1rem, 1.4vw, 1.35rem);
    color: #ffffff;
    background: radial-gradient(circle at 50% 55%, rgba(0, 198, 255, 0.28), transparent 24%), radial-gradient(circle at 50% 50%, rgba(107, 63, 242, 0.22), transparent 38%), linear-gradient(145deg, #06163b 0%, #071f4d 55%, #092e72 100%);
    box-shadow: 0 26px 64px rgba(7, 26, 61, 0.24), inset 0 0 0 1px rgba(255, 255, 255, 0.10);
    animation: rushPanelOpen 0.24s ease-out;
}

    .rush-demo-panel[hidden] {
        display: none;
    }

@keyframes rushPanelOpen {
    from {
        opacity: 0;
        transform: translateY(-8px) scale(0.985);
    }

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

.rush-demo-panel-header {
    position: relative;
    text-align: center;
    padding: 0.25rem 2rem 0.2rem 2rem;
}

    .rush-demo-panel-header h3 {
        max-width: 620px;
        margin: 0 auto;
        color: #ffffff;
        font-size: clamp(1.35rem, 2.25vw, 2.15rem);
        line-height: 1.12;
        font-weight: 950;
        letter-spacing: -0.045em;
    }

    .rush-demo-panel-header p {
        max-width: 530px;
        margin: 0.6rem auto 0 auto;
        color: rgba(234, 242, 255, 0.82);
        font-size: clamp(0.92rem, 1.2vw, 1.08rem);
        line-height: 1.35;
        font-weight: 750;
    }

.rush-demo-close {
    position: absolute;
    top: 0;
    right: 0;
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    color: rgba(255, 255, 255, 0.82);
    background: rgba(255, 255, 255, 0.12);
    font-size: 1.25rem;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}

.rush-demo-caller-map {
    position: relative;
    height: clamp(520px, 34vw, 620px);
    margin-top: 1.05rem;
    border-radius: 24px;
    overflow: hidden;
    background: radial-gradient(circle at 50% 52%, rgba(0, 198, 255, 0.22), transparent 18%), radial-gradient(circle at 50% 50%, rgba(107, 63, 242, 0.18), transparent 36%), linear-gradient(180deg, rgba(2, 10, 33, 0.08), rgba(2, 10, 33, 0.02));
}

    .rush-demo-caller-map::before,
    .rush-demo-caller-map::after {
        content: "";
        position: absolute;
        border-radius: 50%;
        border: 1px solid rgba(80, 178, 255, 0.13);
        pointer-events: none;
    }

    .rush-demo-caller-map::before {
        inset: 19% 23%;
    }

    .rush-demo-caller-map::after {
        inset: 26% 31%;
    }

.rush-gino-main,
.rush-gino-node {
    position: absolute;
    z-index: 3;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #ffffff;
    background: radial-gradient(circle at 28% 18%, rgba(255, 255, 255, 0.52), transparent 20%), linear-gradient(145deg, #1185ff 0%, #2d46ff 45%, #7740f2 100%);
    box-shadow: 0 0 0 4px rgba(63, 213, 255, 0.34), 0 0 34px rgba(0, 198, 255, 0.58), inset 0 -12px 22px rgba(25, 0, 140, 0.28);
    font-weight: 950;
}

.rush-gino-main {
    top: 52%;
    left: 50%;
    width: clamp(104px, 8vw, 132px);
    height: clamp(104px, 8vw, 132px);
    transform: translate(-50%, -50%);
    font-size: clamp(1.85rem, 2.7vw, 2.55rem);
}

.rush-gino-node {
    width: clamp(58px, 4.7vw, 76px);
    height: clamp(58px, 4.7vw, 76px);
    font-size: clamp(0.92rem, 1.25vw, 1.15rem);
}

.rush-gino-one {
    top: 30%;
    left: 42%;
}

.rush-gino-two {
    top: 31%;
    right: 29%;
}

.rush-gino-three {
    top: 49%;
    right: 23%;
}

.rush-gino-four {
    bottom: 19%;
    right: 32%;
}

.rush-gino-five {
    bottom: 19%;
    left: 32%;
}

.rush-gino-six {
    top: 49%;
    left: 23%;
}

.rush-gino-seven {
    top: 31%;
    left: 29%;
}

.rush-caller-card {
    position: absolute;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-width: clamp(145px, 13vw, 190px);
    min-height: 66px;
    border-radius: 999px;
    padding: 0.48rem 0.85rem 0.48rem 0.48rem;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.13);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12), 0 14px 30px rgba(0, 0, 0, 0.20);
    backdrop-filter: blur(10px);
}

    .rush-caller-card img {
        width: 54px;
        height: 54px;
        flex: 0 0 auto;
        border-radius: 50%;
        object-fit: cover;
        background: rgba(255, 255, 255, 0.10);
    }

    .rush-caller-card strong {
        display: block;
        font-size: clamp(0.78rem, 1.05vw, 0.98rem);
        line-height: 1.1;
        font-weight: 950;
    }

.rush-caller-number {
    position: absolute;
    top: 0.22rem;
    left: 3.05rem;
    width: 1.25rem;
    height: 1.25rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #ffffff;
    background: #6b3ff2;
    font-size: 0.68rem;
    font-weight: 950;
}

.rush-caller-one {
    top: 6%;
    left: 50%;
    transform: translateX(-50%);
}

.rush-caller-two {
    top: 20%;
    right: 2%;
}

.rush-caller-three {
    top: 47%;
    right: 0;
}

.rush-caller-four {
    bottom: 5%;
    right: 12%;
}

.rush-caller-five {
    bottom: 5%;
    left: 12%;
}

.rush-caller-six {
    top: 47%;
    left: 0;
}

.rush-caller-seven {
    top: 20%;
    left: 2%;
}

/* Gino microphone permission modal */

.gino-microphone-modal .modal-dialog {
    max-width: 640px;
}

.gino-microphone-modal-content {
    overflow: hidden;
    border: 0;
    border-radius: 28px;
    background: linear-gradient(135deg, #ffffff 0%, #f4f7ff 100%);
    box-shadow: 0 32px 90px rgba(6, 23, 53, 0.28);
}

.gino-microphone-modal-header {
    align-items: center;
    border-bottom: 0;
    padding: 1.15rem 1.25rem;
    color: #ffffff;
    background: linear-gradient(135deg, var(--ve-blue), var(--ve-purple));
}

    .gino-microphone-modal-header .modal-title {
        color: #ffffff;
        font-size: 1.45rem;
        font-weight: 950;
        letter-spacing: -0.03em;
    }

.gino-microphone-modal-body {
    display: grid;
    justify-items: center;
    gap: 1rem;
    padding: clamp(1.25rem, 2vw, 1.85rem);
    text-align: center;
}

.gino-microphone-modal-icon {
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #ffffff;
    background: linear-gradient(135deg, var(--ve-blue), var(--ve-purple));
    box-shadow: 0 16px 34px rgba(91, 75, 255, 0.28);
    font-size: 1.8rem;
}

.gino-microphone-modal-body p {
    max-width: 520px;
    margin: 0;
    color: var(--ve-navy);
    font-size: 1.06rem;
    line-height: 1.55;
    font-weight: 700;
}

.gino-microphone-modal-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
    width: 100%;
}

.gino-microphone-primary-button,
.gino-microphone-secondary-button {
    min-width: 180px;
    border-radius: 999px;
    padding: 0.82rem 1.2rem;
    font-weight: 900;
}

.gino-microphone-primary-button {
    color: #ffffff;
    border: 0;
    background: linear-gradient(135deg, var(--ve-blue), var(--ve-purple));
    box-shadow: 0 14px 30px rgba(0, 92, 191, 0.20);
}

    .gino-microphone-primary-button:hover,
    .gino-microphone-primary-button:focus {
        color: #ffffff;
        transform: translateY(-1px);
    }

.gino-microphone-secondary-button {
    color: var(--ve-navy);
    border: 1px solid rgba(0, 92, 191, 0.22);
    background: rgba(255, 255, 255, 0.92);
}

.gino-microphone-phone-note {
    color: var(--ve-muted) !important;
    font-size: 0.95rem !important;
    font-weight: 750 !important;
}

.phone-demo-notice.phone-demo-card-promoted {
    border-radius: 22px;
    padding: 0.9rem 1rem;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 16px 36px rgba(7, 26, 61, 0.14);
}

.phone-demo-promoted-line1,
.phone-demo-promoted-line2 {
    display: block;
}

.why-gino-modal .modal-dialog {
    max-width: 660px;
}

.why-gino-modal-content {
    overflow: hidden;
    border: 0;
    border-radius: 28px;
    background: linear-gradient(135deg, #ffffff 0%, #f4f7ff 100%);
    box-shadow: 0 32px 90px rgba(6, 23, 53, 0.28);
}

.why-gino-modal-header {
    align-items: center;
    border-bottom: 0;
    padding: 1.15rem 1.25rem;
    color: #ffffff;
    background: linear-gradient(135deg, var(--ve-blue), var(--ve-purple));
}

    .why-gino-modal-header .modal-title {
        color: #ffffff;
        font-size: 1.45rem;
        font-weight: 950;
        letter-spacing: -0.03em;
    }

.why-gino-modal-body {
    padding: clamp(1.25rem, 2vw, 1.85rem);
}

    .why-gino-modal-body p {
        margin: 0;
        color: var(--ve-navy);
        font-size: clamp(1.08rem, 1.45vw, 1.28rem);
        line-height: 1.62;
        font-weight: 750;
        letter-spacing: -0.015em;
    }

@media (max-width: 768px) {
    .hero-logo-rush-row {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-demo-card-stack,
    .rush-demo-panel {
        max-width: 100%;
    }

    .rush-demo-caller-map {
        height: 520px;
    }

    .rush-caller-card {
        min-width: 136px;
    }
}

/* Demo area */

.demo-shell {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(300px, 1fr) minmax(260px, 0.75fr);
    gap: clamp(0.8rem, 1.15vw, 1.25rem);
    height: 100%;
}

.gino-stage,
.control-board,
.feature-card,
.content-section {
    border: 1px solid var(--ve-border);
    background: var(--ve-card);
    box-shadow: 0 18px 48px rgba(7, 26, 61, 0.10);
    backdrop-filter: blur(18px);
}

.gino-stage {
    border-radius: 24px;
    padding: 1rem;
    display: grid;
    gap: 1rem;
}

.gino-portrait-card {
    position: relative;
    min-height: clamp(520px, 36vw, 670px);
    border-radius: 26px;
    overflow: hidden;
    background: radial-gradient(circle at 50% 34%, rgba(0, 116, 255, 0.42), transparent 28%), radial-gradient(circle at 75% 82%, rgba(107, 63, 242, 0.28), transparent 30%), radial-gradient(circle at 20% 26%, rgba(0, 198, 255, 0.13), transparent 30%), linear-gradient(145deg, #06163b 0%, #0b2b62 55%, #0f63b8 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), inset 0 -40px 90px rgba(0, 0, 0, 0.18), 0 24px 60px rgba(7, 26, 61, 0.22);
}

    .gino-portrait-card::before,
    .gino-portrait-card::after {
        content: "";
        position: absolute;
        top: 27%;
        width: 230px;
        height: 230px;
        border-radius: 50%;
        background: repeating-radial-gradient(circle, rgba(73, 169, 255, 0.20) 0 1px, transparent 2px 13px);
        opacity: 0.32;
        pointer-events: none;
    }

    .gino-portrait-card::before {
        left: 7%;
    }

    .gino-portrait-card::after {
        right: 7%;
    }


.gino-mute-button {
    position: absolute;
    top: 1.25rem;
    right: 1.25rem;
    z-index: 7;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 38px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 999px;
    padding: 0.48rem 0.75rem;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 10px 26px rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(10px);
    font-size: 0.85rem;
    font-weight: 900;
    cursor: pointer;
}

    .gino-mute-button:hover,
    .gino-mute-button:focus {
        transform: translateY(-1px);
        background: rgba(255, 255, 255, 0.20);
    }

    .gino-mute-button.is-muted {
        background: linear-gradient(135deg, #c62828, #8b0000);
        border-color: rgba(255, 255, 255, 0.34);
        box-shadow: 0 16px 34px rgba(139, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.16);
    }

.gino-mute-icon {
    line-height: 1;
}

.gino-mute-text {
    line-height: 1;
}

.gino-status-pill {
    position: absolute;
    top: 1.25rem;
    left: 1.25rem;
    z-index: 6;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0;
    color: #ffffff;
    background: transparent;
    border: 0;
    border-radius: 0;
    font-size: 0.9rem;
    font-weight: 900;
    box-shadow: none;
    backdrop-filter: none;
}
    .gino-status-pill::before {
        content: "";
        width: 0.72rem;
        height: 0.72rem;
        border-radius: 50%;
        background: #34e184;
        box-shadow: 0 0 16px rgba(52, 225, 132, 0.72);
    }

    .gino-status-pill.gino-off {
        color: #ffffff;
        background: transparent;
        border-color: transparent;
    }

        .gino-status-pill.gino-off::before {
            background: #ffb2b2;
            box-shadow: 0 0 16px rgba(255, 178, 178, 0.65);
        }

.gino-language-badge {
    position: absolute;
    top: 1.35rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 6;
    display: block;
    padding: 0;
    border: none;
    border-radius: 0;
    min-height: 0;
    background: transparent;
    box-shadow: none;
    color: #ffffff;
    font-size: clamp(0.82rem, 1.05vw, 1rem);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.01em;
    text-align: center;
    white-space: nowrap;
    pointer-events: none;
}

.gino-language-badge-icon {
    display: none;
}

.gino-orb-zone {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4.4rem 2rem 2rem 2rem;
    text-align: center;
}

.gino-orb-button {
    position: relative;
    width: clamp(175px, 15vw, 245px);
    height: clamp(175px, 15vw, 245px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.42rem;
    border: 0;
    border-radius: 50%;
    color: #ffffff;
    background: radial-gradient(circle at 28% 18%, rgba(255, 255, 255, 0.55), transparent 18%), radial-gradient(circle at 30% 28%, rgba(105, 205, 255, 0.58), transparent 28%), linear-gradient(145deg, #1185ff 0%, #2d46ff 45%, #7740f2 100%);
    font-size: clamp(2.4rem, 4.1vw, 4.25rem);
    font-weight: 950;
    letter-spacing: -0.05em;
    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.28);
    cursor: pointer;
    box-shadow: 0 0 0 5px rgba(130, 170, 255, 0.42), 0 0 40px rgba(0, 116, 255, 0.70), 0 0 70px rgba(107, 63, 242, 0.44), 0 28px 38px rgba(0, 0, 0, 0.30), inset 0 5px 18px rgba(255, 255, 255, 0.42), inset 0 -24px 34px rgba(25, 0, 140, 0.30);
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
    animation: ginoOrbIdlePulse 2.65s infinite ease-in-out;
}

.gino-orb-face-wrap {
    width: clamp(74px, 6.2vw, 104px);
    height: clamp(74px, 6.2vw, 104px);
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.24), 0 12px 24px rgba(0, 0, 0, 0.22);
    overflow: hidden;
}

.gino-orb-face {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}

.gino-orb-name {
    display: block;
    font-size: clamp(1.75rem, 3.15vw, 3.25rem);
    line-height: 0.95;
    font-weight: 950;
}

.gino-orb-button::after {
    content: "";
    position: absolute;
    inset: -14px;
    border-radius: 50%;
    border: 2px solid rgba(83, 190, 255, 0.22);
    opacity: 0.85;
    pointer-events: none;
}

.gino-orb-button:hover,
.gino-orb-button:focus {
    transform: translateY(-3px) scale(1.015);
    filter: saturate(1.08) brightness(1.05);
}

.gino-orb-button:active {
    transform: translateY(4px) scale(0.985);
    box-shadow: 0 0 0 4px rgba(130, 170, 255, 0.34), 0 0 32px rgba(0, 116, 255, 0.58), 0 18px 25px rgba(0, 0, 0, 0.30), inset 0 6px 24px rgba(0, 0, 0, 0.25), inset 0 -14px 24px rgba(25, 0, 140, 0.25);
}

@keyframes ginoOrbIdlePulse {
    0%, 100% {
        transform: translateY(0) scale(1);
        box-shadow: 0 0 0 5px rgba(130, 170, 255, 0.42), 0 0 40px rgba(0, 116, 255, 0.70), 0 0 70px rgba(107, 63, 242, 0.44), 0 28px 38px rgba(0, 0, 0, 0.30), inset 0 5px 18px rgba(255, 255, 255, 0.42), inset 0 -24px 34px rgba(25, 0, 140, 0.30);
    }

    50% {
        transform: translateY(-2px) scale(1.018);
        box-shadow: 0 0 0 7px rgba(130, 170, 255, 0.48), 0 0 54px rgba(0, 198, 255, 0.78), 0 0 86px rgba(107, 63, 242, 0.54), 0 30px 42px rgba(0, 0, 0, 0.30), inset 0 5px 18px rgba(255, 255, 255, 0.46), inset 0 -24px 34px rgba(25, 0, 140, 0.30);
    }
}

.gino-portrait-card.is-live .gino-orb-button {
    animation: ginoOrbPulse 1.75s infinite ease-in-out;
}

@keyframes ginoOrbPulse {
    0%, 100% {
        box-shadow: 0 0 0 5px rgba(130, 170, 255, 0.42), 0 0 40px rgba(0, 116, 255, 0.70), 0 0 70px rgba(107, 63, 242, 0.44), 0 28px 38px rgba(0, 0, 0, 0.30), inset 0 5px 18px rgba(255, 255, 255, 0.42), inset 0 -24px 34px rgba(25, 0, 140, 0.30);
    }

    50% {
        box-shadow: 0 0 0 8px rgba(130, 170, 255, 0.50), 0 0 58px rgba(0, 198, 255, 0.86), 0 0 92px rgba(107, 63, 242, 0.58), 0 31px 42px rgba(0, 0, 0, 0.30), inset 0 5px 18px rgba(255, 255, 255, 0.46), inset 0 -24px 34px rgba(25, 0, 140, 0.30);
    }
}

.gino-demo-only-note {
    margin-top: 0.72rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: min(92%, 420px);
    padding: 0.52rem 0.9rem;
    border: 2px solid rgba(255, 255, 255, 0.92);
    border-radius: 999px;
    color: #061735;
    background: #ffffff;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.28);
    font-size: clamp(0.82rem, 1.05vw, 0.98rem);
    font-weight: 950;
    line-height: 1.15;
    letter-spacing: -0.01em;
}

.gino-orb-title {
    margin-top: 1.7rem;
    color: #ffffff;
    font-size: clamp(1.45rem, 2.2vw, 2.15rem);
    font-weight: 950;
    letter-spacing: -0.035em;
}

.gino-orb-subtitle {
    margin-top: 0.28rem;
    color: rgba(222, 232, 255, 0.82);
    font-size: clamp(0.95rem, 1.4vw, 1.25rem);
    font-weight: 850;
}

.gino-capability-line {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem 0.7rem;
    margin-top: 1.05rem;
    color: rgba(226, 235, 255, 0.78);
    font-size: 0.95rem;
    font-weight: 800;
}

    .gino-capability-line span:not(:last-child)::after {
        content: "•";
        margin-left: 0.7rem;
        color: rgba(226, 235, 255, 0.45);
    }

.gino-starter-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.65rem;
    width: min(100%, 760px);
    margin-top: 1.5rem;
}

    .gino-starter-chips span {
        padding: 0.62rem 0.9rem;
        color: rgba(255, 255, 255, 0.92);
        background: rgba(255, 255, 255, 0.10);
        border: 1px solid rgba(255, 255, 255, 0.14);
        border-radius: 999px;
        font-size: 0.84rem;
        font-weight: 850;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.10), 0 10px 20px rgba(0, 0, 0, 0.13);
        backdrop-filter: blur(10px);
    }

.gino-replay-actions,
.hero-replay-actions {
    width: min(100%, 760px);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.gino-replay-actions {
    margin-top: 1.05rem;
}

.hero-replay-actions {
    max-width: 560px;
    margin: 0 0 1.05rem 0;
}

.gino-replay-button {
    display: flex;
    align-items: center;
    gap: 0.72rem;
    min-height: 78px;
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: 20px;
    padding: 0.8rem 0.9rem;
    color: #ffffff;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.22);
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease, opacity 0.18s ease;
}

    .gino-replay-button:hover,
    .gino-replay-button:focus {
        transform: translateY(-1px);
        filter: brightness(1.05);
    }

    .gino-replay-button:disabled {
        opacity: 0.58;
        cursor: default;
        transform: none;
        filter: none;
    }

.gino-replay-complex {
    background: linear-gradient(135deg, rgba(0, 116, 255, 0.94), rgba(91, 75, 255, 0.92));
}

.gino-replay-language {
    background: linear-gradient(135deg, rgba(10, 115, 69, 0.95), rgba(20, 124, 255, 0.90));
}

.gino-replay-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.18);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
    font-size: 1.25rem;
    font-weight: 950;
}

.gino-replay-button strong,
.gino-replay-button em {
    display: block;
}

.gino-replay-button strong {
    color: #ffffff;
    font-size: 0.98rem;
    font-weight: 950;
    line-height: 1.12;
}

.gino-replay-button em {
    margin-top: 0.18rem;
    color: rgba(255, 255, 255, 0.84);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 750;
    line-height: 1.25;
}

@media (max-width: 768px) {
    .gino-replay-actions,
    .hero-replay-actions {
        grid-template-columns: 1fr;
        gap: 0.55rem;
    }

    .gino-replay-actions {
        margin-top: 0.85rem;
    }

    .hero-replay-actions {
        margin-bottom: 0.95rem;
    }

    .gino-replay-button {
        min-height: 68px;
        padding: 0.72rem 0.82rem;
        border-radius: 18px;
    }

    .gino-replay-icon {
        width: 38px;
        height: 38px;
        flex-basis: 38px;
        font-size: 1.12rem;
    }
}

.stage-hangup-button {
    width: min(88%, 360px);
    margin-top: 1.1rem;
    border: 0;
    border-radius: 999px;
    padding: 0.95rem 1.25rem;
    color: #ffffff;
    background: linear-gradient(135deg, #c62828, #8b0000);
    font-size: 1.05rem;
    font-weight: 900;
    box-shadow: 0 18px 42px rgba(139, 0, 0, 0.34);
}

    .stage-hangup-button:hover,
    .stage-hangup-button:focus {
        transform: translateY(-1px);
    }

.voice-wave {
    position: absolute;
    right: 1.3rem;
    bottom: 1.25rem;
    display: flex;
    gap: 0.4rem;
    align-items: end;
    z-index: 5;
    opacity: 0.45;
}

    .voice-wave span {
        width: 10px;
        height: 18px;
        border-radius: 99px;
        background: linear-gradient(to top, #17d5ff, #7a4dff);
        box-shadow: 0 0 18px rgba(23, 213, 255, 0.55);
        animation: veWave 1.1s infinite ease-in-out;
        animation-play-state: paused;
    }

        .voice-wave span:nth-child(2) {
            height: 30px;
            animation-delay: 0.10s;
        }

        .voice-wave span:nth-child(3) {
            height: 42px;
            animation-delay: 0.20s;
        }

        .voice-wave span:nth-child(4) {
            height: 60px;
            animation-delay: 0.30s;
        }

        .voice-wave span:nth-child(5) {
            height: 46px;
            animation-delay: 0.40s;
        }

        .voice-wave span:nth-child(6) {
            height: 34px;
            animation-delay: 0.50s;
        }

.gino-portrait-card.is-live .voice-wave {
    opacity: 1;
}

    .gino-portrait-card.is-live .voice-wave span {
        animation-play-state: running;
    }

@keyframes veWave {
    0%, 100% {
        transform: scaleY(0.42);
        opacity: 0.48;
    }

    50% {
        transform: scaleY(1);
        opacity: 1;
    }
}

/* Transcript */

.transcript-card {
    border: 1px solid rgba(7, 26, 61, 0.10);
    border-radius: 20px;
    background: #ffffff;
    overflow: hidden;
}

.transcript-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem;
    color: var(--ve-navy);
    background: #f4f7ff;
    border-bottom: 1px solid rgba(7, 26, 61, 0.08);
    font-weight: 900;
}

.transcript-small {
    color: var(--ve-muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.transcript-log {
    min-height: clamp(150px, 14vw, 240px);
    max-height: 260px;
    overflow-y: auto;
    padding: 1rem;
}

.transcript-line {
    margin-bottom: 0.7rem;
    padding: 0.72rem 0.85rem;
    border-radius: 14px;
    color: #253149;
    background: #f7f9fe;
    line-height: 1.45;
    font-size: 0.94rem;
}

.transcript-original {
    font-weight: 650;
}

.transcript-english {
    margin-top: 0.35rem;
    padding-top: 0.35rem;
    border-top: 1px solid rgba(7, 26, 61, 0.10);
    color: var(--ve-muted);
    font-size: 0.88rem;
    font-weight: 500;
}

.transcript-gino {
    background: rgba(0, 116, 255, 0.09);
}

.transcript-system {
    color: var(--ve-muted);
    background: #f5f6fa;
}

.transcript-user {
    color: var(--ve-navy);
    background: rgba(107, 63, 242, 0.08);
}

/* Temporary live transcript panel */

/* Inline live transcript panel */

.gino-conversation-area {
    width: min(100%, 760px);
    margin-top: 1.05rem;
}

.gino-idle-prompts[hidden],
.gino-inline-transcript-panel[hidden] {
    display: none;
}

.gino-inline-transcript-panel {
    width: 100%;
    margin: 0 auto;
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.13);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.10), 0 14px 32px rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(12px);
    animation: liveTranscriptAppear 0.22s ease-out;
}

    .gino-inline-transcript-panel .transcript-header {
        padding: 0.58rem 0.78rem;
        color: #061735;
        background: rgba(255, 255, 255, 0.92);
        border-bottom-color: rgba(255, 255, 255, 0.16);
        font-size: 0.82rem;
    }

    .gino-inline-transcript-panel .transcript-small {
        font-size: 0.68rem;
    }

    .gino-inline-transcript-panel .transcript-log {
        min-height: 135px;
        max-height: 188px;
        padding: 0.72rem;
        background: rgba(7, 26, 61, 0.16);
    }

    .gino-inline-transcript-panel .transcript-line {
        margin-bottom: 0.52rem;
        padding: 0.58rem 0.68rem;
        border-radius: 13px;
        font-size: 0.82rem;
        line-height: 1.34;
        text-align: left;
    }

@keyframes liveTranscriptAppear {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }

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

/* Printer proof overlay */

.gino-stage {
    position: relative;
}

.printer-proof-overlay {
    position: absolute;
    inset: 0;
    z-index: 30;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(7, 26, 61, 0.42);
    backdrop-filter: blur(10px);
    border-radius: 24px;
}

    .printer-proof-overlay[hidden] {
        display: none;
    }

.printer-proof-card {
    width: min(100%, 760px);
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 24px;
    padding: 1rem;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(242, 246, 255, 0.94));
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.30);
    overflow: hidden;
}

.printer-proof-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: baseline;
    margin-bottom: 0.9rem;
    color: var(--ve-navy);
}

    .printer-proof-header span {
        font-size: 1.05rem;
        font-weight: 950;
    }

    .printer-proof-header small {
        color: var(--ve-muted);
        font-weight: 800;
    }

.printer-proof-printers {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.printer-proof-unit {
    position: relative;
    min-height: 355px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
}

.printer-slot {
    position: absolute;
    top: 0;
    width: min(84%, 250px);
    height: 270px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    overflow: hidden;
    border-radius: 10px 10px 4px 4px;
    background: linear-gradient(180deg, #111318 0%, #1b1f27 18%, transparent 19%);
    box-shadow: inset 0 12px 18px rgba(0, 0, 0, 0.42);
}

.printer-base {
    width: min(96%, 310px);
    height: 92px;
    display: grid;
    place-items: end center;
    padding-bottom: 1rem;
    border-radius: 18px 18px 24px 24px;
    color: rgba(255, 255, 255, 0.82);
    background: linear-gradient(145deg, #111318 0%, #292f3a 55%, #090a0d 100%);
    box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.10), inset 0 -10px 24px rgba(0, 0, 0, 0.42), 0 16px 30px rgba(0, 0, 0, 0.26);
}

    .printer-base span {
        font-size: 0.82rem;
        font-weight: 900;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

.thermal-ticket {
    width: 210px;
    min-height: 360px;
    padding: 0.85rem 0.75rem 1.1rem 0.75rem;
    color: #151515;
    background: #fffdf2;
    font-family: "Courier New", monospace;
    font-size: 0.82rem;
    line-height: 1.25;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.25);
    transform: translateY(-112%);
}

.printer-proof-overlay.printing .thermal-ticket {
    animation: thermalTicketFeed 1.25s steps(9, end) forwards;
}

.printer-proof-overlay.printing .checkout-ticket {
    animation-delay: 0.16s;
}

@keyframes thermalTicketFeed {
    0% {
        transform: translateY(-112%);
    }

    72% {
        transform: translateY(-10%);
    }

    100% {
        transform: translateY(0);
    }
}

.ticket-small {
    text-align: center;
    font-weight: 700;
}

.ticket-number {
    margin: 0.1rem 0 0.35rem 0;
    text-align: center;
    font-size: 2.6rem;
    line-height: 1;
    font-weight: 900;
}

.ticket-mode {
    margin: 0.35rem 0 0.65rem 0;
    text-align: center;
    font-size: 1.05rem;
    font-weight: 900;
}

.ticket-store {
    text-align: center;
    margin-bottom: 0.16rem;
}

.ticket-heading {
    margin: 0.9rem 0 0.35rem 0;
    font-weight: 900;
}

.ticket-line,
.ticket-time {
    margin-bottom: 0.28rem;
}

.kitchen-ticket {
    font-size: 0.92rem;
}

    .kitchen-ticket .ticket-number {
        font-size: 3rem;
    }

.checkout-ticket {
    min-height: 455px;
}

@media (max-width: 720px) {
    .printer-proof-printers {
        grid-template-columns: 1fr;
    }

    .printer-proof-card {
        max-height: 92vh;
        overflow-y: auto;
    }
}

/* Store phone handoff overlay */

.store-handoff-overlay {
    position: absolute;
    inset: 0;
    z-index: 34;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(7, 26, 61, 0.50);
    backdrop-filter: blur(10px);
    border-radius: 24px;
}

    .store-handoff-overlay[hidden] {
        display: none;
    }

.store-handoff-card {
    width: min(100%, 780px);
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 24px;
    padding: 1rem;
    color: var(--ve-navy);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.97), rgba(241, 246, 255, 0.95));
    box-shadow: 0 28px 70px rgba(0, 0, 0, 0.30);
    transform: translateY(10px);
    opacity: 0;
    transition: opacity 0.22s ease, transform 0.22s ease;
}

.store-handoff-overlay.active .store-handoff-card {
    transform: translateY(0);
    opacity: 1;
}

.store-handoff-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: baseline;
    margin-bottom: 1rem;
}

    .store-handoff-header span {
        font-size: 1.05rem;
        font-weight: 950;
    }

    .store-handoff-header small {
        color: var(--ve-muted);
        font-weight: 800;
    }

.store-handoff-flow {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: stretch;
}

.store-handoff-phone {
    min-height: 250px;
    border: 1px solid rgba(7, 26, 61, 0.12);
    border-radius: 22px;
    padding: 1rem;
    background: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55), 0 14px 30px rgba(7, 26, 61, 0.12);
}

.store-handoff-store {
    background: linear-gradient(180deg, #ffffff 0%, #f3f7ff 100%);
    border-color: rgba(20, 92, 255, 0.24);
}

.store-phone-label {
    margin-bottom: 0.6rem;
    color: var(--ve-muted);
    font-size: 0.78rem;
    font-weight: 950;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.store-phone-icon {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    margin-bottom: 0.8rem;
    border-radius: 18px;
    background: rgba(20, 92, 255, 0.10);
    font-size: 1.75rem;
}

.store-handoff-phone p {
    margin: 0;
    color: #17213a;
    font-size: 1rem;
    line-height: 1.45;
    font-weight: 800;
}

.store-handoff-arrow {
    display: grid;
    place-items: center;
    color: rgba(20, 92, 255, 0.78);
    font-size: 2.4rem;
    font-weight: 950;
}

.store-handoff-note {
    margin-top: 0.9rem;
    padding: 0.75rem 0.85rem;
    border-radius: 16px;
    color: var(--ve-muted);
    background: rgba(20, 92, 255, 0.08);
    font-size: 0.9rem;
    font-weight: 800;
}

@media (max-width: 720px) {
    .store-handoff-flow {
        grid-template-columns: 1fr;
    }

    .store-handoff-arrow {
        transform: rotate(90deg);
    }

    .store-handoff-card {
        max-height: 92vh;
        overflow-y: auto;
    }
}

/* Control board iPad preview */

.control-board {
    min-width: 0;
}

.ipad-control-board {
    border: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    padding: 0;
    overflow: visible;
}

.ipad-control-caption {
    display: grid;
    gap: 0.12rem;
    margin: 0.8rem auto 0 auto;
    max-width: 440px;
    color: var(--ve-navy);
    text-align: center;
    letter-spacing: -0.018em;
}

    .ipad-control-caption strong {
        display: block;
        color: var(--ve-navy);
        font-size: clamp(1.35rem, 1.65vw, 1.75rem);
        font-weight: 950;
        line-height: 1.05;
    }

    .ipad-control-caption .ipad-control-caption-kicker {
        display: block;
        color: #1f2d4f;
        font-size: clamp(1.05rem, 1.28vw, 1.35rem);
        font-weight: 650;
        line-height: 1.18;
    }

    .ipad-control-caption span {
        display: block;
        color: #1f2d4f;
        font-size: clamp(1.05rem, 1.28vw, 1.35rem);
        font-weight: 650;
        line-height: 1.18;
    }

.ipad-handheld-frame {
    position: relative;
    width: min(100%, 760px);
    margin: clamp(1.1rem, 2.2vw, 2.2rem) auto 0 auto;
    padding: 0;
    aspect-ratio: 1086 / 1448;
    perspective: none;
}

.ipad-photo-frame {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    user-select: none;
    pointer-events: none;
    filter: drop-shadow(0 24px 46px rgba(7, 26, 61, 0.18));
}

.ipad-handheld-frame::after,
.ipad-hand-fingers,
.ipad-hand-thumb {
    display: none !important;
}

.ipad-device {
    position: absolute;
    z-index: 2;
    top: 13.1%;
    left: 8.8%;
    width: 73.7%;
    height: 72.8%;
    margin: 0;
    padding: 0;
    border-radius: 7px;
    background: #f7f8fb;
    box-shadow: none;
    overflow: hidden;
}

.control-board.gino-off .ipad-device {
    box-shadow: none;
}

.ipad-camera,
.ipad-home-button {
    display: none;
}

.ipad-screen {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: 7px;
    background: #f7f8fb;
    box-shadow: none;
}

.ipad-status-bar {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 0.5rem;
    height: 28px;
    padding: 0 0.5rem;
    color: rgba(255, 255, 255, 0.92);
    background: linear-gradient(to bottom, #333941, #1f242b);
    font-size: clamp(0.5rem, 0.82vw, 0.68rem);
    font-weight: 800;
    white-space: nowrap;
}

    .ipad-status-bar span {
        white-space: nowrap;
    }

        .ipad-status-bar span:nth-child(2) {
            text-align: center;
        }

        .ipad-status-bar span:nth-child(3) {
            text-align: right;
        }

.ipad-board-surface {
    position: relative;
    height: calc(100% - 28px);
    min-height: 0;
    padding: 0.58rem 0.58rem 0.82rem 0.58rem;
    overflow: hidden;
    background: linear-gradient(180deg, #ffffff 0%, #f6f7f9 100%);
}

.ipad-pickup-card {
    padding: 0.62rem;
    border: 1px solid rgba(7, 26, 61, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55);
}

    .ipad-pickup-card h2 {
        margin: 0 0 0.56rem 0;
        color: #6f7884;
        font-size: clamp(1.35rem, 2.28vw, 2.08rem);
        line-height: 0.98;
        font-weight: 900;
        letter-spacing: -0.055em;
        text-align: center;
    }

.ipad-pickup-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.5rem;
}

.ipad-pickup-button {
    position: relative;
    min-height: clamp(42px, 5.7vw, 58px);
    border: 3px solid rgba(0, 0, 0, 0.15);
    border-radius: 11px;
    color: #ffffff;
    font-size: clamp(0.9rem, 1.45vw, 1.28rem);
    font-weight: 900;
    text-shadow: 0 2px 3px rgba(0, 0, 0, 0.24);
    cursor: pointer;
    touch-action: manipulation;
    box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.30), inset 0 -8px 0 rgba(0, 0, 0, 0.12), 0 6px 0 rgba(0, 0, 0, 0.18), 0 9px 16px rgba(0, 0, 0, 0.14);
}

    .ipad-pickup-button::before {
        content: "";
        position: absolute;
        top: 7px;
        right: 8px;
        left: 8px;
        height: 38%;
        border-radius: 9px;
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0.30), rgba(255, 255, 255, 0.08));
        pointer-events: none;
    }

    .ipad-pickup-button:active,
    .ipad-pickup-button.selected {
        transform: translateY(4px);
        box-shadow: inset 0 4px 8px rgba(0, 0, 0, 0.18), inset 0 2px 0 rgba(255, 255, 255, 0.14), 0 3px 0 rgba(0, 0, 0, 0.18), 0 5px 10px rgba(0, 0, 0, 0.13);
        filter: saturate(1.04) brightness(0.94);
    }

    .ipad-pickup-button.v15 {
        background: linear-gradient(to bottom, #b9f6a5 0%, #6fcd4f 100%);
    }

    .ipad-pickup-button.v20 {
        background: linear-gradient(to bottom, #9bea7a 0%, #43b929 100%);
    }

    .ipad-pickup-button.v25 {
        background: linear-gradient(to bottom, #6fd85a 0%, #218f16 100%);
    }

    .ipad-pickup-button.v30 {
        background: linear-gradient(to bottom, #d6ed5b 0%, #9dbb20 100%);
    }

    .ipad-pickup-button.v35 {
        background: linear-gradient(to bottom, #ffe76a 0%, #d5b100 100%);
    }

    .ipad-pickup-button.v40 {
        background: linear-gradient(to bottom, #ffbc5e 0%, #ef7f00 100%);
    }

    .ipad-pickup-button.v45 {
        background: linear-gradient(to bottom, #ff9a9a 0%, #e25555 100%);
    }

    .ipad-pickup-button.v50 {
        background: linear-gradient(to bottom, #ff5f5f 0%, #c81919 100%);
    }

.ipad-credit-panel {
    margin-top: 0.8rem;
    min-height: 166px;
    padding: 0.9rem 0.9rem 3.15rem 0.9rem;
    border: 1px solid rgba(7, 26, 61, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: 0 10px 24px rgba(7, 26, 61, 0.06), inset 0 0 0 1px rgba(255, 255, 255, 0.65);
}

.ipad-credit-title {
    display: block;
    margin-bottom: 0.2rem;
    color: #6f7884;
    font-size: clamp(0.78rem, 1.08vw, 0.96rem);
    font-weight: 900;
    text-align: center;
}

.ipad-credit-value {
    color: #424a56;
    font-size: clamp(1.25rem, 1.9vw, 1.72rem);
    font-weight: 900;
    letter-spacing: -0.04em;
    text-align: center;
}

.ipad-credit-slider {
    width: 100%;
    height: 26px;
    margin-top: 0.65rem;
    accent-color: #35af31;
}

.ipad-credit-range {
    display: flex;
    justify-content: space-between;
    margin-top: 0.18rem;
    color: #687280;
    font-size: 0.72rem;
    font-weight: 900;
}

.ipad-control-bottom-row {
    position: absolute;
    right: 0.56rem;
    bottom: 0.10rem;
    left: 0.56rem;
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    align-items: center;
}

.ipad-footer-button {
    min-width: 82px;
    border: 0;
    border-radius: 999px;
    padding: 0.46rem 0.56rem;
    color: #ffffff;
    font-size: 0.64rem;
    font-weight: 900;
    text-align: center;
    box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.25), inset 0 -7px 0 rgba(0, 0, 0, 0.14), 0 6px 0 rgba(0, 0, 0, 0.18), 0 9px 18px rgba(0, 0, 0, 0.20);
    cursor: pointer;
    user-select: none;
    touch-action: manipulation;
}

    .ipad-footer-button:active {
        transform: translateY(4px);
        box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.18), inset 0 -6px 0 rgba(0, 0, 0, 0.18), 0 3px 0 rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.18);
    }

    .ipad-footer-button input {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

.ai-answering-button {
    background: linear-gradient(to bottom, #34b95a 0%, #1f8f3a 100%);
}

    .ai-answering-button.staff-answering {
        background: linear-gradient(to bottom, #e04a4a 0%, #c62828 100%);
    }

.conversations-button {
    background: linear-gradient(to bottom, #6a727f 0%, #4f5661 100%);
}

.ipad-conversation-screen {
    position: absolute;
    inset: 0;
    z-index: 8;
    display: flex;
    flex-direction: column;
    padding: 1rem 1rem 4.25rem 1rem;
    background: linear-gradient(180deg, #ffffff 0%, #f6f7f9 100%);
}

    .ipad-conversation-screen[hidden] {
        display: none;
    }

.ipad-conversation-header {
    display: block;
    padding: 0.85rem 0.9rem;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(7, 26, 61, 0.08), inset 0 0 0 1px rgba(7, 26, 61, 0.08);
}

.ipad-conversation-title {
    color: #005cbf;
    font-size: clamp(0.78rem, 1.12vw, 1.02rem);
    font-weight: 900;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ipad-conversation-meta {
    display: none;
}

.ipad-conversation-back {
    position: absolute;
    right: 0.56rem;
    bottom: 0.56rem;
    min-width: 88px;
    border: 0;
    border-radius: 999px;
    padding: 0.52rem 0.62rem;
    color: #ffffff;
    background: linear-gradient(to bottom, #6a727f 0%, #4f5661 100%);
    font-size: 0.68rem;
    font-weight: 900;
    text-align: center;
    box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.25), inset 0 -7px 0 rgba(0, 0, 0, 0.14), 0 6px 0 rgba(0, 0, 0, 0.18), 0 9px 18px rgba(0, 0, 0, 0.20);
    cursor: pointer;
    user-select: none;
    touch-action: manipulation;
}

.ipad-conversation-transcript {
    flex: 1;
    overflow-y: auto;
    margin-top: 0.85rem;
    padding-right: 0.25rem;
}

.ipad-conversation-transcript {
    flex: 1;
    overflow-y: auto;
    margin-top: 0.85rem;
    padding-right: 0.25rem;
    padding-bottom: 1rem;
}

.ipad-conversation-role {
    margin-bottom: 0.3rem;
    color: #6f7884;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.ipad-conversation-turn.gino .ipad-conversation-role {
    color: #1f8f3a;
}

.ipad-conversation-turn.customer .ipad-conversation-role {
    color: #c77700;
}

.ipad-conversation-text {
    color: #111827;
    font-size: 0.86rem;
    font-weight: 650;
    line-height: 1.34;
    white-space: pre-wrap;
}

.ipad-conversation-hint {
    position: absolute;
    right: 6.4rem;
    bottom: 0.92rem;
    left: 1rem;
    color: #6f7884;
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
}

.ipad-hidden-summary,
.visually-hidden-control {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
}

/* Lower sections */

.feature-section,
.content-section {
    width: 100%;
    max-width: 1900px;
    margin: 0 auto 2rem auto;
}

.feature-section {
    padding: clamp(1rem, 2vw, 1.25rem);
}

.section-heading {
    max-width: 820px;
    margin-bottom: 1rem;
}

    .section-heading h2 {
        color: var(--ve-navy);
        font-size: clamp(1.8rem, 3vw, 3rem);
        font-weight: 900;
        letter-spacing: -0.035em;
    }

.feature-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.feature-card {
    min-height: 180px;
    border-radius: 22px;
    padding: 1.25rem;
}

    .feature-card h3 {
        color: var(--ve-navy);
        font-weight: 900;
        margin-bottom: 0.7rem;
    }

    .feature-card p {
        color: var(--ve-muted);
        line-height: 1.6;
        margin: 0;
    }

.content-section {
    border-radius: 20px;
    padding: 1.25rem;
}

    .content-section p {
        margin: 0;
    }

/* Contact page */

.contact-page-shell {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto 2rem auto;
}

.contact-hero-card {
    display: grid;
    grid-template-columns: minmax(280px, 0.85fr) minmax(320px, 0.75fr);
    gap: clamp(1.2rem, 2vw, 2rem);
    align-items: stretch;
    padding: clamp(1.2rem, 2.2vw, 2.5rem);
    border: 1px solid var(--ve-border);
    border-radius: clamp(18px, 1.6vw, 32px);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(245, 248, 255, 0.9)), radial-gradient(circle at 82% 22%, rgba(0, 116, 255, 0.12), transparent 34%), radial-gradient(circle at 12% 88%, rgba(107, 63, 242, 0.10), transparent 34%);
    box-shadow: var(--ve-shadow);
}

.contact-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.contact-title {
    max-width: 760px;
    margin-bottom: 1rem;
    color: var(--ve-navy);
    font-size: clamp(2.2rem, 4vw, 4.7rem);
    line-height: 1;
    font-weight: 950;
    letter-spacing: -0.055em;
}

.contact-subtitle {
    max-width: 720px;
    margin-bottom: 1.4rem;
    color: #344158;
    font-size: clamp(1.05rem, 1.35vw, 1.25rem);
    line-height: 1.65;
}

.contact-note-card {
    max-width: 680px;
    display: grid;
    gap: 0.25rem;
    padding: 1rem 1.15rem;
    border: 1px solid rgba(0, 92, 191, 0.16);
    border-radius: 18px;
    color: var(--ve-navy);
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 14px 34px rgba(7, 26, 61, 0.08);
}

    .contact-note-card span {
        color: var(--ve-muted);
        line-height: 1.45;
    }

.contact-form-card {
    min-width: 0;
    border: 1px solid var(--ve-border);
    border-radius: 24px;
    padding: clamp(1rem, 1.7vw, 1.5rem);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 20px 52px rgba(7, 26, 61, 0.12);
    backdrop-filter: blur(18px);
}

.contact-form {
    display: grid;
    gap: 1rem;
}

.contact-field-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.contact-field label {
    margin-bottom: 0.35rem;
    color: var(--ve-navy);
    font-weight: 850;
}

.contact-field .form-control,
.contact-field .form-select {
    min-height: 46px;
    border-color: rgba(20, 45, 90, 0.16);
    border-radius: 12px;
}

.contact-message-box {
    resize: vertical;
}

.contact-submit-button {
    width: 100%;
    border-radius: 14px;
    padding: 0.95rem 1.2rem;
}

.contact-privacy-note {
    margin: 0;
    color: var(--ve-muted);
    font-size: 0.92rem;
    line-height: 1.45;
    text-align: center;
}

.contact-validation-summary ul {
    margin-bottom: 0;
}

.contact-hidden-field {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.contact-success {
    display: grid;
    place-items: start;
    gap: 0.8rem;
    min-height: 360px;
    align-content: center;
}

    .contact-success h2 {
        margin: 0;
        color: var(--ve-navy);
        font-size: clamp(2rem, 3vw, 3rem);
        font-weight: 950;
        letter-spacing: -0.045em;
    }

    .contact-success p {
        margin: 0;
        color: var(--ve-muted);
        font-size: 1.05rem;
        line-height: 1.55;
    }

.contact-return-link {
    display: inline-flex;
    text-decoration: none;
}

@media (max-width: 980px) {
    .contact-hero-card {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .contact-field-row {
        grid-template-columns: 1fr;
    }
}

/* Top navigation cleanup */

.ve-navbar {
    min-height: 76px;
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(16px);
}

    .ve-navbar .container-fluid {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
    }

.nav-logo {
    width: 42px;
    height: auto;
}

.ve-brand {
    flex: 0 0 auto;
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: 0.2px;
    color: var(--ve-navy) !important;
    white-space: nowrap;
}

.ve-navbar .navbar-collapse {
    flex-basis: auto;
    flex-grow: 1;
    justify-content: flex-end;
}

.ve-top-nav-links {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap !important;
    gap: 1.25rem;
    margin-left: auto;
    white-space: nowrap;
}

    .ve-top-nav-links .nav-item {
        flex: 0 0 auto;
    }

    .ve-top-nav-links .nav-link {
        color: #555555 !important;
        font-size: 1.08rem;
        font-weight: 650;
        padding-left: 0;
        padding-right: 0;
        text-decoration: none;
        white-space: nowrap;
    }

        .ve-top-nav-links .nav-link.active,
        .ve-top-nav-links .nav-link.show,
        .ve-top-nav-links .nav-link:focus,
        .ve-top-nav-links .nav-link:visited {
            color: #555555 !important;
        }

        .ve-top-nav-links .nav-link:hover {
            color: var(--ve-navy) !important;
        }

/* POS Integration page */

.pos-page-shell {
    width: 100%;
    max-width: 1200px;
    margin: -1.2rem auto 2.5rem auto;
    padding: 0 0.5rem;
    color: #132033;
}

.pos-flow-page {
    max-width: 1500px;
}

.pos-flow-hero {
    display: grid;
    grid-template-columns: minmax(320px, 0.42fr) minmax(640px, 0.88fr);
    gap: 1.25rem;
    align-items: stretch;
}

.pos-flow-copy {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 430px;
    padding: clamp(2rem, 3vw, 3.2rem);
    background: linear-gradient(135deg, #ffffff 0%, #fbfdfb 66%, #eef7f0 100%);
    border: 1px solid rgba(15, 35, 75, 0.08);
    border-radius: 24px;
    box-shadow: 0 14px 38px rgba(7, 26, 61, 0.08);
    overflow: hidden;
}

    .pos-flow-copy::after {
        content: "";
        position: absolute;
        right: -25%;
        bottom: -32%;
        width: 520px;
        height: 250px;
        border-radius: 50%;
        background: repeating-radial-gradient(circle, rgba(10, 92, 56, 0.07) 0 1px, transparent 2px 10px);
        transform: rotate(-8deg);
        pointer-events: none;
    }

    .pos-flow-copy h1 {
        position: relative;
        z-index: 1;
        max-width: 620px;
        margin: 0;
        color: #101827;
        font-size: clamp(3rem, 5.2vw, 5.7rem);
        line-height: 0.95;
        font-weight: 950;
        letter-spacing: -0.06em;
    }

.pos-flow-subtitle {
    position: relative;
    z-index: 1;
    max-width: 560px;
    margin: 1.35rem 0 0 0;
    color: #2b3542;
    font-size: clamp(1.15rem, 1.8vw, 1.45rem);
    line-height: 1.45;
    font-weight: 650;
}

.pos-flow-lead {
    position: relative;
    z-index: 1;
    max-width: 560px;
    margin: 1rem 0 0 0;
    color: #5b6675;
    font-size: 1rem;
    line-height: 1.62;
    font-weight: 550;
}

.pos-flow-diagram {
    min-height: 430px;
    padding: clamp(1.2rem, 2vw, 2rem);
    border: 1px solid rgba(15, 35, 75, 0.08);
    border-radius: 24px;
    background: radial-gradient(circle at 50% 18%, rgba(89, 176, 128, 0.16), transparent 28%), linear-gradient(135deg, #ffffff 0%, #f7fbf8 100%);
    box-shadow: 0 14px 38px rgba(7, 26, 61, 0.08);
}

.pos-flow-top-row {
    display: grid;
    grid-template-columns: minmax(110px, 1fr) 42px minmax(110px, 1fr) 42px minmax(135px, 1.15fr);
    gap: 0.7rem;
    align-items: center;
    justify-items: center;
}

.pos-flow-node {
    width: 100%;
    min-height: 128px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 0.2rem;
    padding: 0.9rem;
    border: 1px solid rgba(10, 74, 49, 0.11);
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 14px 28px rgba(7, 26, 61, 0.07), inset 0 0 0 1px rgba(255, 255, 255, 0.70);
    text-align: center;
}

.pos-flow-cloud {
    min-height: 158px;
    border-radius: 50%;
/*    border: 5px solid rgba(89, 176, 128, 0.38);
*/    border: 4px solid #000000;
    box-shadow: 0 18px 38px rgba(7, 26, 61, 0.10), 0 0 0 8px rgba(89, 176, 128, 0.08);
}

.pos-flow-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    margin-bottom: 0.35rem;
    border-radius: 50%;
    color: #0a6a3f;
    background: #eef8f1;
    font-size: 1.55rem;
}

.pos-flow-node strong,
.pos-flow-destination strong,
.pos-flow-pos-box strong {
    display: block;
    color: #132033;
    font-size: 0.98rem;
    line-height: 1.15;
    font-weight: 950;
}

.pos-flow-node span,
.pos-flow-destination span,
.pos-flow-pos-box span {
    display: block;
    margin-top: 0.16rem;
    color: #5f6b7c;
    font-size: 0.83rem;
    line-height: 1.25;
    font-weight: 650;
}

.pos-flow-arrow {
    color: #16803f;
    font-size: 2.35rem;
    font-weight: 950;
    line-height: 1;
}

.pos-flow-branch-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-top: 1.3rem;
}

.pos-flow-branch {
    min-width: 0;
    display: grid;
    justify-items: center;
}

.pos-flow-branch-label {
    min-width: 142px;
    padding: 0.48rem 0.8rem;
    border-radius: 10px;
    color: #0a4a31;
    background: #dff1e4;
    font-size: 0.86rem;
    font-weight: 950;
    text-align: center;
}

.pos-flow-branch-line {
    width: 3px;
    height: 24px;
    background: #16803f;
    position: relative;
}

    .pos-flow-branch-line::after {
        content: "";
        position: absolute;
        bottom: -1px;
        left: 50%;
        width: 12px;
        height: 12px;
        border-right: 3px solid #16803f;
        border-bottom: 3px solid #16803f;
        transform: translateX(-50%) rotate(45deg);
        background: transparent;
    }

.pos-flow-printer-grid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.pos-flow-destination,
.pos-flow-pos-box {
    min-height: 118px;
    padding: 1rem;
    border: 1px solid rgba(15, 35, 75, 0.10);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 14px 28px rgba(7, 26, 61, 0.08);
}

.pos-flow-destination {
    display: grid;
    justify-items: center;
    align-content: center;
    text-align: center;
}

.pos-flow-destination-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    margin-bottom: 0.5rem;
    border-radius: 14px;
    color: #0a6a3f;
    background: #eef8f1;
    font-size: 1.35rem;
}

.pos-flow-pos-box {
    width: 100%;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.75rem 0.9rem;
    align-items: center;
}

    .pos-flow-pos-box .pos-flow-destination-icon {
        margin-bottom: 0;
    }

.pos-flow-mini-chips {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.35rem;
}

    .pos-flow-mini-chips span {
        display: inline-flex;
        align-items: center;
        min-height: 28px;
        padding: 0.3rem 0.52rem;
        border: 1px solid rgba(10, 74, 49, 0.14);
        border-radius: 999px;
        color: #0a4a31;
        background: #ffffff;
        font-size: 0.74rem;
        font-weight: 850;
        box-shadow: 0 6px 13px rgba(7, 26, 61, 0.06);
    }

.pos-flow-paths {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    margin-top: 1.25rem;
}

.pos-flow-path-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: 132px;
    padding: 1.2rem;
    border: 1px solid rgba(15, 35, 75, 0.10);
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 14px 32px rgba(7, 26, 61, 0.07);
}

.pos-flow-path-icon,
.pos-flow-cta-icon {
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    color: #0a6a3f;
    background: #eef8f1;
    font-size: 1.65rem;
}

.pos-flow-path-card h2 {
    margin: 0 0 0.3rem 0;
    color: #0a6a3f;
    font-size: 1.45rem;
    line-height: 1.15;
    font-weight: 950;
    letter-spacing: -0.035em;
}

.pos-flow-path-card p {
    margin: 0;
    color: #3c4757;
    font-size: 0.98rem;
    line-height: 1.42;
    font-weight: 550;
}

.pos-flow-systems-card {
    margin-top: 1.25rem;
    padding: 1.55rem;
    border: 1px solid rgba(15, 35, 75, 0.10);
    border-radius: 22px;
    background: #ffffff;
    box-shadow: 0 14px 32px rgba(7, 26, 61, 0.07);
}

.pos-flow-section-heading {
    text-align: center;
}

    .pos-flow-section-heading h2 {
        margin: 0 0 1.05rem 0;
        color: #132033;
        font-size: clamp(1.65rem, 2.45vw, 2.35rem);
        line-height: 1.12;
        font-weight: 950;
        letter-spacing: -0.04em;
    }

.pos-flow-chip-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.68rem;
}

    .pos-flow-chip-grid span {
        display: inline-flex;
        align-items: center;
        min-height: 38px;
        padding: 0.48rem 0.85rem;
        border: 1px solid rgba(10, 74, 49, 0.13);
        border-radius: 999px;
        color: #132033;
        background: #ffffff;
        font-size: 0.92rem;
        font-weight: 850;
        box-shadow: 0 8px 18px rgba(7, 26, 61, 0.07);
    }

.pos-flow-availability-note {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.45rem;
    margin: 1rem 0 0 0;
    color: #5f6b7c;
    font-size: 0.94rem;
    line-height: 1.45;
    font-weight: 650;
    text-align: center;
}

    .pos-flow-availability-note::before {
        content: "ⓘ";
        color: #0a6a3f;
        font-size: 1.05rem;
    }

.pos-flow-cta-card {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    margin-top: 1.25rem;
    padding: 1.25rem 1.35rem;
    border: 1px solid rgba(10, 92, 56, 0.18);
    border-radius: 22px;
    background: linear-gradient(135deg, #f3fbf5 0%, #ffffff 100%);
    box-shadow: 0 14px 32px rgba(7, 26, 61, 0.07);
}

.pos-flow-cta-copy {
    flex: 1;
}

    .pos-flow-cta-copy h2 {
        margin: 0 0 0.25rem 0;
        color: #132033;
        font-size: 1.55rem;
        line-height: 1.15;
        font-weight: 950;
        letter-spacing: -0.035em;
    }

    .pos-flow-cta-copy p {
        margin: 0;
        color: #3c4757;
        font-size: 0.98rem;
        line-height: 1.42;
        font-weight: 550;
    }

/* Pricing page */

.pricing-page-shell {
    width: 100%;
    max-width: 1500px;
    margin: -1.2rem auto 2.5rem auto;
    padding: 0 0.5rem;
    color: #132033;
}

.pricing-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(360px, 0.92fr) minmax(420px, 1fr);
    align-items: stretch;
    min-height: 430px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.88) 34%, rgba(255, 255, 255, 0.30) 58%, rgba(255, 255, 255, 0.04) 100%), url("/Images/pastel_communication_flow_background.png") center center / cover no-repeat;
    border: 1px solid rgba(127, 151, 130, 0.20);
    border-radius: 34px;
    box-shadow: 0 18px 46px rgba(7, 26, 61, 0.08);
    overflow: hidden;
    isolation: isolate;
}

.pricing-hero-copy {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 3rem 2.75rem 2.8rem 3rem;
    background: transparent;
}

.pricing-hero-eyebrow {
    margin: 0 0 0.85rem 0;
    color: #0d6a43;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.pricing-hero-copy h1 {
    margin: 0;
    color: #0a6a3f;
    font-size: clamp(2.9rem, 4.5vw, 4.6rem);
    line-height: 0.97;
    font-weight: 950;
    letter-spacing: -0.055em;
}

.pricing-hero-subtitle {
    max-width: 560px;
    margin: 1rem 0 0 0;
    color: #202833;
    font-size: clamp(1.2rem, 1.85vw, 1.9rem);
    line-height: 1.35;
    font-weight: 650;
}

.pricing-hero-rule {
    width: 68px;
    height: 4px;
    margin: 1.45rem 0 1.25rem 0;
    border-radius: 999px;
    background: #42a46d;
}

.pricing-hero-lead {
    max-width: 520px;
    margin: 0;
    color: #2b3542;
    font-size: clamp(1.02rem, 1.15vw, 1.18rem);
    line-height: 1.72;
    font-weight: 600;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.85);
}

.pricing-hero-image-panel {
    position: relative;
    min-height: 430px;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 5.25rem 4.3rem 2.5rem 1.3rem;
    background: transparent;
}

.pricing-hero-image,
.pricing-hero-image-fade {
    display: none;
}

.pricing-primary-card {
    width: calc(100% - 4rem);
    margin: -18px auto 0 auto;
    display: grid;
    grid-template-columns: 0.92fr 1.28fr;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(15, 35, 75, 0.10);
    border-radius: 24px;
    box-shadow: 0 26px 54px rgba(7, 26, 61, 0.14);
    overflow: hidden;
    position: relative;
    z-index: 4;
}

.pricing-price-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.6rem;
    min-height: 385px;
    text-align: center;
    color: #ffffff;
    background: radial-gradient(circle at 20% 22%, rgba(42, 152, 101, 0.36), transparent 26%), linear-gradient(135deg, #0a7345 0%, #0a5c38 42%, #083724 100%);
}

.pricing-price-box-label {
    margin: 0 0 1rem 0;
    font-size: 0.98rem;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.88);
}

.pricing-price-amount {
    font-size: clamp(4.2rem, 7vw, 6.6rem);
    line-height: 0.92;
    font-weight: 950;
    letter-spacing: -0.065em;
    color: #ffffff;
}

.pricing-price-frequency {
    margin-top: 0.9rem;
    padding-top: 0.9rem;
    width: min(100%, 240px);
    border-top: 1px solid rgba(255, 255, 255, 0.22);
    font-size: 1.15rem;
    font-weight: 900;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.92);
}

.pricing-no-volume-box {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    width: min(100%, 320px);
    margin-top: 1.5rem;
    padding: 1rem 1.05rem;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 18px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    text-align: left;
}

.pricing-no-volume-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #f1fbf4;
    color: #0a5c38;
    font-size: 1.45rem;
    font-weight: 900;
}

.pricing-no-volume-text strong {
    display: block;
    color: #ffffff;
    font-size: 1.55rem;
    line-height: 1.02;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.pricing-no-volume-text small {
    display: block;
    margin-top: 0.16rem;
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.92rem;
    font-weight: 700;
}

.pricing-included-box {
    padding: 1.9rem 2rem 1.7rem 2rem;
}

    .pricing-included-box h2,
    .pricing-yearly-box h2,
    .pricing-faq-heading h2,
    .pricing-cta-copy h2 {
        margin: 0 0 1rem 0;
        color: #0a4a31;
        font-size: clamp(1.95rem, 2.4vw, 2.8rem);
        line-height: 1.05;
        font-weight: 900;
        letter-spacing: -0.04em;
    }

.pricing-included-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.82rem;
}

    .pricing-included-list li {
        position: relative;
        padding-left: 1.75rem;
        color: #1f2d3c;
        font-size: 1.01rem;
        line-height: 1.48;
        font-weight: 650;
    }

        .pricing-included-list li::before {
            content: "✓";
            position: absolute;
            left: 0;
            top: 0.12rem;
            width: 1.1rem;
            height: 1.1rem;
            display: grid;
            place-items: center;
            border-radius: 50%;
            background: #42a46d;
            color: #ffffff;
            font-size: 0.72rem;
            font-weight: 900;
        }

.pricing-onboarding-strip {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-height: 54px;
    padding: 0.8rem 1rem;
    background: #eef5ee;
    border-top: 1px solid rgba(15, 35, 75, 0.08);
}

.pricing-onboarding-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    background: #0a4a31;
    color: #ffffff;
    font-size: 1rem;
}

.pricing-onboarding-strip p {
    margin: 0;
    color: #1b2a2d;
    font-size: 0.95rem;
    line-height: 1.45;
    font-weight: 700;
}

.pricing-comparison-card {
    width: 100%;
    margin: 1.45rem auto 0 auto;
    display: grid;
    grid-template-columns: 0.9fr 1.3fr;
    background: #ffffff;
    border: 1px solid rgba(15, 35, 75, 0.12);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(7, 26, 61, 0.09);
    overflow: hidden;
}

.pricing-yearly-box {
    padding: 2rem 2rem 1.8rem 2rem;
}

    .pricing-yearly-box h2 {
        font-size: clamp(2.2rem, 3.5vw, 3.4rem);
    }

    .pricing-yearly-box p {
        max-width: 330px;
        margin: 0;
        color: #2c3645;
        font-size: 1rem;
        line-height: 1.72;
        font-weight: 550;
    }

.pricing-comparison-box {
    padding: 2rem 2rem 1.8rem 2rem;
    border-left: 1px solid rgba(15, 35, 75, 0.10);
}

    .pricing-comparison-box h3 {
        margin: 0 0 1rem 0;
        color: #0a4a31;
        font-size: 1.5rem;
        line-height: 1.2;
        font-weight: 900;
    }

.pricing-comparison-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem 1.4rem;
}

    .pricing-comparison-grid div {
        position: relative;
        padding-left: 1.4rem;
        color: #1f2d3c;
        font-size: 0.98rem;
        font-weight: 700;
    }

        .pricing-comparison-grid div::before {
            content: "✓";
            position: absolute;
            left: 0;
            top: 0;
            color: #2f9f63;
            font-weight: 900;
        }

.pricing-call-capacity {
    position: relative;
    margin: 1.45rem 0 0 0;
    padding-left: 1.55rem;
    color: #0a4a31;
    font-size: 1.08rem;
    font-weight: 900;
    line-height: 1.35;
}

    .pricing-call-capacity::before {
        content: "✓";
        position: absolute;
        left: 0;
        top: 0;
        color: #2f9f63;
        font-weight: 900;
    }

.pricing-support-strip {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.3rem;
    background: linear-gradient(135deg, #0a5c38 0%, #0a4a31 55%, #083724 100%);
    color: #ffffff;
}

.pricing-support-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 14px;
    border: 2px solid rgba(255, 224, 138, 0.55);
    font-size: 1.45rem;
}

.pricing-support-strip p {
    margin: 0;
    font-size: 1.15rem;
    line-height: 1.4;
    font-weight: 850;
}

.pricing-pos-card {
    width: 100%;
    margin: 1.55rem auto 0 auto;
    padding: 1.45rem;
    background: #ffffff;
    border: 1px solid rgba(15, 35, 75, 0.12);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(7, 26, 61, 0.09);
}

.pricing-pos-header {
    max-width: 820px;
    margin: 0 auto 1.25rem auto;
    text-align: center;
}

.pricing-pos-eyebrow {
    margin: 0 0 0.45rem 0;
    color: #0d6a43;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.pricing-pos-header h2 {
    margin: 0;
    color: #0a4a31;
    font-size: clamp(2rem, 3vw, 3.1rem);
    line-height: 1.05;
    font-weight: 950;
    letter-spacing: -0.045em;
}

.pricing-pos-header p {
    max-width: 760px;
    margin: 0.75rem auto 0 auto;
    color: #2b3542;
    font-size: 1.02rem;
    line-height: 1.65;
    font-weight: 550;
}

.pricing-pos-path-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.pricing-pos-path-card {
    min-height: 245px;
    padding: 1.2rem;
    border: 1px solid rgba(15, 35, 75, 0.10);
    border-radius: 16px;
    background: #f8fbf9;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

    .pricing-pos-path-card.primary {
        background: linear-gradient(180deg, #eff8f2 0%, #ffffff 100%);
        border-color: rgba(10, 92, 56, 0.20);
    }

.pricing-pos-path-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    margin-bottom: 0.85rem;
    border-radius: 14px;
    background: linear-gradient(135deg, #0a5c38 0%, #0a4a31 100%);
    color: #ffffff;
    font-size: 1.25rem;
    box-shadow: 0 10px 22px rgba(7, 74, 49, 0.16);
}

.pricing-pos-path-card h3 {
    margin: 0 0 0.65rem 0;
    color: #0a4a31;
    font-size: 1.22rem;
    line-height: 1.2;
    font-weight: 900;
}

.pricing-pos-path-card p {
    margin: 0;
    color: #2b3542;
    font-size: 0.96rem;
    line-height: 1.58;
    font-weight: 550;
}

.pricing-pos-note {
    margin-top: 1rem;
    padding: 1rem 1.1rem;
    border-radius: 16px;
    color: #1b2a2d;
    background: #eef5ee;
    font-size: 0.96rem;
    line-height: 1.55;
    font-weight: 650;
}

    .pricing-pos-note strong {
        color: #0a4a31;
        font-weight: 900;
    }

.pricing-pos-systems {
    margin-top: 1.25rem;
}

    .pricing-pos-systems h3 {
        margin: 0 0 0.85rem 0;
        color: #0a4a31;
        font-size: 1.35rem;
        line-height: 1.2;
        font-weight: 900;
        text-align: center;
    }

.pricing-pos-chip-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.55rem;
}

    .pricing-pos-chip-grid span {
        display: inline-flex;
        align-items: center;
        min-height: 34px;
        padding: 0.45rem 0.72rem;
        border: 1px solid rgba(10, 74, 49, 0.16);
        border-radius: 999px;
        color: #0a4a31;
        background: #ffffff;
        font-size: 0.88rem;
        font-weight: 800;
        box-shadow: 0 7px 16px rgba(7, 26, 61, 0.06);
    }

.pricing-workflow-card {
    width: 100%;
    margin: 1.55rem auto 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1.25rem 1.35rem;
    background: #ffffff;
    border: 1px solid rgba(15, 35, 75, 0.12);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(7, 26, 61, 0.09);
}

.pricing-workflow-copy h2 {
    margin: 0 0 0.55rem 0;
    color: #0a4a31;
    font-size: clamp(1.65rem, 2.35vw, 2.25rem);
    line-height: 1.08;
    font-weight: 950;
    letter-spacing: -0.04em;
}

.pricing-workflow-copy p {
    max-width: 720px;
    margin: 0;
    color: #2b3542;
    font-size: 0.98rem;
    line-height: 1.58;
    font-weight: 550;
}

.pricing-workflow-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    flex: 0 0 auto;
    min-width: 245px;
    padding: 0.9rem 1.25rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #0a5c38 0%, #0a4a31 100%);
    color: #ffffff;
    text-decoration: none;
    font-size: 0.98rem;
    font-weight: 850;
    box-shadow: 0 10px 24px rgba(7, 74, 49, 0.18);
}

    .pricing-workflow-link:hover,
    .pricing-workflow-link:focus {
        color: #ffffff;
        transform: translateY(-1px);
    }

    .pricing-workflow-link span {
        font-size: 1.25rem;
        line-height: 1;
    }

.pricing-faq-section {
    width: 100%;
    margin: 1.65rem auto 0 auto;
}

.pricing-faq-heading {
    text-align: center;
}

    .pricing-faq-heading h2 {
        margin-bottom: 0.5rem;
    }

.pricing-faq-heading-rule {
    width: 66px;
    height: 3px;
    margin: 0 auto;
    border-radius: 999px;
    background: #59b080;
}

.pricing-faq-table {
    margin-top: 1.2rem;
    border: 1px solid rgba(15, 35, 75, 0.12);
    border-radius: 16px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 12px 28px rgba(7, 26, 61, 0.08);
}

.pricing-faq-row {
    display: grid;
    grid-template-columns: 0.9fr 1.4fr auto;
    gap: 1rem;
    align-items: center;
    min-height: 72px;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid rgba(15, 35, 75, 0.10);
}

    .pricing-faq-row:last-child {
        border-bottom: 0;
    }

.pricing-faq-question {
    color: #132033;
    font-size: 0.98rem;
    font-weight: 800;
}

.pricing-faq-answer {
    color: #2b3542;
    font-size: 0.97rem;
    line-height: 1.5;
    font-weight: 550;
}

.pricing-faq-plus {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 2px solid #42a46d;
    border-radius: 50%;
    color: #42a46d;
    font-size: 1.15rem;
    font-weight: 900;
}

.pricing-cta-card {
    width: 100%;
    margin: 1.4rem auto 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.2rem;
    background: #ffffff;
    border: 1px solid rgba(15, 35, 75, 0.12);
    border-radius: 18px;
    box-shadow: 0 12px 28px rgba(7, 26, 61, 0.08);
}

.pricing-cta-left {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.pricing-cta-icon {
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    background: linear-gradient(135deg, #0a5c38 0%, #0a4a31 100%);
    color: #ffffff;
    font-size: 1.3rem;
}

.pricing-cta-copy h2 {
    margin-bottom: 0.2rem;
    font-size: 1.8rem;
}

.pricing-cta-copy p {
    margin: 0;
    color: #2b3542;
    font-size: 0.98rem;
    font-weight: 550;
}

.pricing-cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-width: 220px;
    padding: 0.9rem 1.25rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #0a5c38 0%, #0a4a31 100%);
    color: #ffffff;
    text-decoration: none;
    font-size: 0.98rem;
    font-weight: 850;
    box-shadow: 0 10px 24px rgba(7, 74, 49, 0.18);
}

@media (max-width: 980px) {
    .pricing-workflow-card {
        flex-direction: column;
        align-items: stretch;
    }

    .pricing-workflow-link {
        width: 100%;
    }
}

.pricing-cta-button:hover,
.pricing-cta-button:focus {
    color: #ffffff;
    transform: translateY(-1px);
}

.pricing-cta-button span {
    font-size: 1.25rem;
    line-height: 1;
}

@media (max-width: 980px) {
    .pricing-hero,
    .pricing-primary-card,
    .pricing-comparison-card,
    .pricing-pos-path-grid,
    .pos-flow-hero,
    .pos-flow-paths,
    .pos-flow-branch-row {
        grid-template-columns: 1fr;
    }

    .pricing-primary-card {
        margin-top: 1.2rem;
    }

    .pricing-hero-image-panel {
        min-height: 0;
        padding: 0 2.75rem 2.5rem 3rem;
    }

    .pricing-hero-lead {
        max-width: 680px;
    }

    .pricing-comparison-box {
        border-left: 0;
        border-top: 1px solid rgba(15, 35, 75, 0.10);
    }

    .pricing-cta-card {
        flex-direction: column;
        align-items: stretch;
    }

    .pricing-cta-button {
        width: 100%;
    }
}

@media (max-width: 720px) {
    .pricing-page-shell {
        padding: 0 0.15rem;
    }

    .pricing-hero {
        grid-template-columns: 1fr;
        min-height: 0;
        border-radius: 26px;
        background-position: center top;
    }

    .pricing-hero-copy {
        padding: 1.5rem 1.5rem 0.85rem 1.5rem;
        background: rgba(255, 255, 255, 0.92);
    }

    .pricing-hero-image-panel {
        min-height: 0;
        padding: 0 1.5rem 1.5rem 1.5rem;
        background: rgba(255, 255, 255, 0.92);
    }

    .pricing-primary-card {
        width: 100%;
        margin-top: 1.2rem;
        border-radius: 20px;
    }

    .pricing-no-volume-text strong {
        font-size: 1.28rem;
    }

    .pricing-pos-card {
        padding: 1.15rem;
    }

    .pricing-pos-header {
        text-align: left;
    }

    .pricing-pos-systems h3 {
        text-align: left;
    }

    .pricing-pos-chip-grid {
        justify-content: flex-start;
    }

    .pricing-hero-copy,
    .pricing-included-box,
    .pricing-yearly-box,
    .pricing-comparison-box {
        padding: 1.4rem;
    }

    .pricing-faq-row,
    .pricing-comparison-grid {
        grid-template-columns: 1fr;
    }

    .pricing-cta-left {
        align-items: flex-start;
    }

    .pos-page-shell {
        padding: 0 0.15rem;
    }

    .pos-flow-copy,
    .pos-flow-diagram,
    .pos-flow-systems-card,
    .pos-flow-cta-card {
        padding: 1.25rem;
    }

    .pos-flow-top-row {
        grid-template-columns: 1fr;
    }

    .pos-flow-arrow {
        transform: rotate(90deg);
    }

    .pos-flow-printer-grid {
        grid-template-columns: 1fr;
    }

    .pos-flow-cta-card {
        flex-direction: column;
        align-items: stretch;
    }

        .pos-flow-cta-card .pricing-cta-button {
            width: 100%;
        }

    /* Existing content pages */

    .page-title,
    .section-title {
        font-weight: 800;
        margin-bottom: 1rem;
    }

    .page-title {
        font-size: 2rem;
    }

    .section-title {
        font-size: 1.25rem;
        margin-top: 1.5rem;
    }


    /* SMS Privacy / SMS Terms legal pages */

    .sms-legal-page {
        position: relative;
        max-width: 1220px;
        margin: 0 auto 3.5rem auto;
        padding: clamp(1.2rem, 3vw, 2.5rem) 0;
    }

        .sms-legal-page::before,
        .sms-legal-page::after {
            content: "";
            position: absolute;
            z-index: 0;
            pointer-events: none;
        }

        .sms-legal-page::before {
            right: -7vw;
            top: 8rem;
            width: 290px;
            height: 290px;
            border-radius: 50%;
            background: repeating-radial-gradient(circle, rgba(20, 124, 255, 0.14) 0 1px, transparent 2px 12px);
            opacity: 0.55;
        }

        .sms-legal-page::after {
            left: -8vw;
            bottom: 4rem;
            width: 240px;
            height: 240px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(91, 75, 255, 0.10), transparent 68%);
        }

    .sms-legal-card {
        position: relative;
        z-index: 1;
        overflow: hidden;
        padding: clamp(1.5rem, 3vw, 2.3rem);
        border: 1px solid rgba(15, 35, 75, 0.10);
        border-radius: 28px;
        background: rgba(255, 255, 255, 0.94);
        box-shadow: 0 26px 80px rgba(6, 23, 53, 0.13);
        backdrop-filter: blur(18px);
    }

        .sms-legal-card::before {
            content: "";
            position: absolute;
            top: -140px;
            right: -120px;
            width: 380px;
            height: 380px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(20, 124, 255, 0.11), transparent 68%);
            pointer-events: none;
        }

    .sms-legal-hero {
        position: relative;
        z-index: 1;
        display: flex;
        align-items: flex-start;
        gap: 1.05rem;
        margin-bottom: 1.2rem;
    }

    .sms-legal-hero-icon,
    .sms-legal-row-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        border-radius: 50%;
        color: var(--ve-bright-blue);
        background: linear-gradient(145deg, rgba(20, 124, 255, 0.12), rgba(91, 75, 255, 0.07));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
    }

    .sms-legal-hero-icon {
        width: 52px;
        height: 52px;
        margin-top: 0.2rem;
        font-size: 1.35rem;
        font-weight: 800;
    }

    .sms-legal-eyebrow {
        margin: 0 0 0.25rem 0;
        color: var(--ve-bright-blue);
        font-size: 0.78rem;
        font-weight: 800;
        letter-spacing: 0.075em;
        text-transform: uppercase;
    }

    .sms-legal-card h1 {
        margin: 0;
        color: var(--ve-navy);
        font-size: clamp(2.35rem, 4vw, 3.8rem);
        font-weight: 850;
        letter-spacing: -0.045em;
        line-height: 1.02;
    }

    .sms-legal-title-rule {
        width: 54px;
        height: 4px;
        margin-top: 1.05rem;
        border-radius: 999px;
        background: linear-gradient(90deg, var(--ve-bright-blue), var(--ve-purple));
    }

    .sms-legal-intro {
        position: relative;
        z-index: 1;
        max-width: 1020px;
        margin: 0 0 1.25rem 0;
        color: var(--ve-text);
        font-size: 1.02rem;
        line-height: 1.7;
    }

    .sms-legal-list {
        position: relative;
        z-index: 1;
        border-top: 1px solid rgba(15, 35, 75, 0.10);
    }

    .sms-legal-row {
        display: grid;
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 1.15rem;
        padding: 1.35rem 0;
        border-bottom: 1px solid rgba(15, 35, 75, 0.10);
    }

    .sms-legal-row-icon {
        width: 48px;
        height: 48px;
        margin-top: 0.05rem;
        font-size: 1.15rem;
        font-weight: 850;
    }

    .sms-legal-row h2 {
        margin: 0 0 0.4rem 0;
        color: var(--ve-navy);
        font-size: clamp(1.05rem, 1.55vw, 1.28rem);
        font-weight: 800;
        letter-spacing: -0.02em;
    }

    .sms-legal-row p {
        max-width: 1030px;
        margin: 0.18rem 0 0 0;
        color: var(--ve-text);
        font-size: 0.98rem;
        line-height: 1.65;
    }

    .sms-legal-row a {
        color: var(--ve-bright-blue);
        font-weight: 650;
    }

    .sms-legal-home-link {
        position: relative;
        z-index: 1;
        display: inline-flex;
        align-items: center;
        gap: 0.45rem;
        margin-top: 1.1rem;
        color: var(--ve-bright-blue);
        font-weight: 800;
        text-decoration: none;
    }

        .sms-legal-home-link:hover {
            color: var(--ve-blue);
            text-decoration: underline;
        }

    @media (max-width: 768px) {
        .sms-legal-page {
            padding-top: 0.75rem;
            padding-bottom: 2rem;
        }

        .sms-legal-card {
            padding: 1.2rem;
            border-radius: 22px;
        }

        .sms-legal-hero {
            gap: 0.8rem;
        }

        .sms-legal-hero-icon {
            width: 44px;
            height: 44px;
            font-size: 1.05rem;
        }

        .sms-legal-card h1 {
            font-size: clamp(2rem, 9vw, 2.85rem);
        }

        .sms-legal-row {
            grid-template-columns: 1fr;
            gap: 0.65rem;
            padding: 1.1rem 0;
        }

        .sms-legal-row-icon {
            width: 42px;
            height: 42px;
        }
    }

    /* Footer */

    .footer {
        position: static;
        width: 100%;
        white-space: nowrap;
        line-height: 60px;
        background: rgba(255, 255, 255, 0.82);
    }

    .footer-inner {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .footer-links a {
        text-decoration: none;
    }

    /* Responsive behavior */

    @container (max-width: 720px) {
        .demo-shell {
            grid-template-columns: minmax(0, 1fr);
        }
    }

    @media (max-width: 1250px) {
        .hero-fluid-grid {
            grid-template-columns: 1fr;
        }

        .hero-copy {
            justify-content: flex-start;
        }
    }

    @media (max-width: 1200px) {
        .feature-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-height: 820px) and (min-width: 901px) {
        .ve-hero {
            padding: clamp(0.75rem, 1.4vw, 1.4rem);
        }

        .hero-logo {
            width: clamp(105px, 10vw, 175px);
            margin-bottom: 0.7rem !important;
        }

        .hero-eyebrow {
            margin-bottom: 0.4rem;
            font-size: 0.72rem;
        }

        .hero-title {
            margin-bottom: 0.65rem;
            font-size: clamp(2rem, 3.4vw, 4rem);
            line-height: 1;
        }

        .hero-subtitle {
            margin-bottom: 0.8rem;
            font-size: clamp(0.95rem, 1.15vw, 1.12rem);
            line-height: 1.45;
        }

        .hero-note {
            display: none;
        }

        .gino-stage {
            padding: 0.7rem;
            gap: 0.7rem;
        }

        .gino-portrait-card {
            min-height: clamp(220px, 20vw, 300px);
        }

        .transcript-log {
            min-height: 120px;
            max-height: 160px;
            padding: 0.75rem;
        }

        .control-board {
            padding: 0.75rem;
        }

        .control-board-header {
            margin-bottom: 0.6rem;
        }

        .control-row {
            padding: 0.65rem 0;
        }

        .control-help {
            font-size: 0.78rem;
        }

        .control-summary {
            margin-top: 0.65rem;
        }
    }

    @media (max-height: 700px) and (min-width: 901px) {
        .hero-subtitle {
            display: none;
        }

        .hero-title {
            font-size: clamp(1.8rem, 3vw, 3.35rem);
        }

        .gino-portrait-card {
            min-height: 210px;
        }

        .transcript-log {
            min-height: 95px;
            max-height: 120px;
        }

        .control-help {
            display: none;
        }
    }

    @media (max-width: 768px) {
        .hero-actions {
            align-items: stretch;
            flex-direction: column;
        }

            .hero-actions .btn {
                width: 100%;
            }

        .gino-portrait-card {
            min-height: 610px;
        }

        .gino-orb-zone {
            justify-content: flex-start;
            padding: 4.9rem 0.85rem 1.15rem 0.85rem;
        }

        .gino-orb-button {
            width: 145px;
            height: 145px;
        }

        .gino-orb-face-wrap {
            width: 62px;
            height: 62px;
        }

        .gino-orb-name {
            font-size: 1.7rem;
        }

        .gino-orb-title {
            margin-top: 0.9rem;
            font-size: 1.28rem;
            line-height: 1.08;
        }

        .gino-orb-subtitle {
            font-size: 0.92rem;
        }

        .gino-demo-only-note {
            margin-top: 0.75rem;
            max-width: 94%;
            padding: 0.48rem 0.78rem;
            font-size: 0.72rem;
        }

        .gino-capability-line {
            margin-top: 0.85rem;
            gap: 0.32rem 0.42rem;
            font-size: 0.74rem;
            line-height: 1.25;
        }

            .gino-capability-line span:not(:last-child)::after {
                margin-left: 0.42rem;
            }

        .gino-starter-chips {
            margin-top: 0.85rem;
            gap: 0.42rem;
        }

            .gino-starter-chips span {
                padding: 0.42rem 0.52rem;
                font-size: 0.68rem;
            }

        .feature-grid {
            grid-template-columns: 1fr;
        }

        .control-summary {
            grid-template-columns: 1fr;
        }

        .footer {
            white-space: normal;
            line-height: 1.5;
            padding: 1rem 0;
        }

        .footer-inner {
            align-items: flex-start;
            flex-direction: column;
            gap: 0.5rem;
        }
    }
}


/* Common Questions page */

.questions-page-shell {
    position: relative;
    max-width: 1900px;
    margin: 0 auto 2rem auto;
    min-height: calc(100vh - 160px);
    padding: clamp(2.25rem, 5vw, 5.25rem) clamp(1.1rem, 3vw, 3.75rem) clamp(2rem, 4vw, 4rem);
    border: 1px solid rgba(88, 96, 111, 0.16);
    border-radius: clamp(18px, 1.6vw, 32px);
    background:
        linear-gradient(90deg, rgba(255,255,255,0.62), rgba(255,255,255,0.40)),
        url('/Images/questions-watercolor-bg.png') center center / cover no-repeat;
    box-shadow: 0 28px 80px rgba(6, 23, 53, 0.14);
    overflow: hidden;
}

.questions-page-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 42%, rgba(255,255,255,0.60), rgba(255,255,255,0.22) 44%, rgba(255,255,255,0.08) 100%);
    pointer-events: none;
}

.questions-hero,
.questions-card-grid,
.questions-cta-card {
    position: relative;
    z-index: 1;
}

.questions-hero {
    max-width: 940px;
    margin: 0 auto clamp(1.65rem, 3vw, 2.4rem);
    text-align: center;
}

.questions-script-label {
    margin: 0 0 -0.6rem;
    color: rgba(28, 61, 82, 0.74);
    font-family: "Segoe Script", "Bradley Hand ITC", "Brush Script MT", cursive;
    font-size: clamp(2rem, 3vw, 3.25rem);
    line-height: 1;
    transform: rotate(-3deg);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.2em;
}

.questions-title {
    margin: 0;
    color: rgba(26, 29, 34, 0.86);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(3.1rem, 6vw, 6.35rem);
    font-weight: 500;
    line-height: 0.98;
    letter-spacing: -0.04em;
}

.questions-title-rule {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.9rem;
    margin: 1.15rem auto 1.1rem;
    color: rgba(174, 133, 70, 0.82);
}

.questions-title-rule span {
    width: clamp(58px, 8vw, 120px);
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(174, 133, 70, 0.75), transparent);
}

.questions-title-rule em {
    font-style: normal;
    font-size: 1.1rem;
}

.questions-subtitle {
    max-width: 820px;
    margin: 0 auto;
    color: rgba(32, 42, 58, 0.78);
    font-size: clamp(1.05rem, 1.4vw, 1.35rem);
    line-height: 1.6;
}

.questions-card-grid {
    max-width: 1500px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: clamp(1rem, 1.7vw, 1.45rem);
}

.question-card {
    min-height: 250px;
    padding: clamp(1.35rem, 2vw, 2rem);
    border: 1px solid rgba(132, 105, 64, 0.18);
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(255, 253, 248, 0.94), rgba(255, 250, 241, 0.90));
    box-shadow: 0 14px 26px rgba(80, 62, 42, 0.16), inset 0 0 0 7px rgba(255,255,255,0.36);
    backdrop-filter: blur(4px);
}

.question-card:nth-child(2),
.question-card:nth-child(3) {
    transform: translateY(6px);
}

.question-heading-row {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1rem;
    align-items: start;
}

.question-badge {
    display: inline-flex;
    width: 2.45rem;
    height: 2.45rem;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: rgba(20, 29, 42, 0.86);
    background: rgba(209, 218, 219, 0.86);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.5rem;
    font-weight: 700;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
}

.question-card h2 {
    margin: 0;
    color: rgba(21, 28, 39, 0.92);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.35rem, 1.65vw, 1.85rem);
    line-height: 1.18;
    font-weight: 700;
    letter-spacing: -0.015em;
}

.question-card-rule {
    height: 1px;
    margin: 1.25rem 0 1.15rem;
    background: linear-gradient(90deg, rgba(174, 133, 70, 0.12), rgba(174, 133, 70, 0.55), rgba(174, 133, 70, 0.12));
}

.question-card p {
    margin: 0;
    color: rgba(40, 48, 61, 0.80);
    font-size: clamp(0.98rem, 1.1vw, 1.08rem);
    line-height: 1.68;
}

.questions-cta-card {
    max-width: 1500px;
    margin: clamp(1.4rem, 2.5vw, 2rem) auto 0;
    padding: clamp(1.2rem, 2vw, 1.7rem);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border: 1px solid rgba(15, 35, 75, 0.13);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 18px 40px rgba(6, 23, 53, 0.10);
    backdrop-filter: blur(12px);
}

.questions-cta-kicker {
    margin: 0 0 0.25rem;
    color: var(--ve-bright-blue);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.questions-cta-card h2 {
    margin: 0;
    color: var(--ve-navy);
    font-size: clamp(1.35rem, 2vw, 2rem);
    font-weight: 850;
    letter-spacing: -0.03em;
}

.questions-cta-button {
    text-decoration: none;
    white-space: nowrap;
}

/* Home page questions teaser */

.home-questions-teaser {
    max-width: 1400px;
    margin: 0 auto 2rem;
    padding: clamp(1.3rem, 2.5vw, 2.2rem);
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, 0.9fr) auto;
    gap: clamp(1rem, 2vw, 1.6rem);
    align-items: center;
    border: 1px solid var(--ve-border);
    border-radius: 24px;
    background: linear-gradient(135deg, rgba(255,255,255,0.93), rgba(247,249,255,0.88));
    box-shadow: var(--ve-shadow);
}

.home-questions-copy h2 {
    margin: 0 0 0.55rem;
    color: var(--ve-navy);
    font-size: clamp(1.6rem, 2.3vw, 2.35rem);
    font-weight: 900;
    letter-spacing: -0.04em;
}

.home-questions-copy p:last-child {
    margin: 0;
    color: var(--ve-muted);
    font-size: 1.02rem;
    line-height: 1.6;
}

.home-questions-mini-grid {
    display: grid;
    gap: 0.55rem;
}

.home-questions-mini-grid span {
    padding: 0.75rem 0.95rem;
    border: 1px solid rgba(15, 35, 75, 0.10);
    border-radius: 14px;
    color: rgba(21, 32, 51, 0.85);
    background: rgba(255,255,255,0.72);
    font-weight: 700;
    box-shadow: 0 10px 24px rgba(6, 23, 53, 0.06);
}

.home-questions-link {
    text-decoration: none;
    white-space: nowrap;
}

.founder-proof-strip {
    width: min(100%, 1400px);
    margin: -0.65rem auto 1.6rem auto;
    padding: 0.55rem 1rem;
    color: rgba(21, 32, 51, 0.72);
    font-size: 0.92rem;
    font-weight: 750;
    line-height: 1.35;
    text-align: center;
}

    .founder-proof-strip span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0.48rem 0.85rem;
        border: 1px solid rgba(15, 35, 75, 0.10);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.70);
        box-shadow: 0 10px 24px rgba(6, 23, 53, 0.06);
    }

@media (max-width: 1050px) {
    .home-questions-teaser {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .home-questions-link {
        text-align: center;
    }
}

@media (max-width: 900px) {
    .questions-card-grid {
        grid-template-columns: 1fr;
    }

    .question-card,
    .question-card:nth-child(2),
    .question-card:nth-child(3) {
        min-height: 0;
        transform: none;
    }

    .questions-cta-card {
        align-items: stretch;
        flex-direction: column;
    }

    .questions-cta-button {
        text-align: center;
    }
}

@media (max-width: 640px) {
    .questions-page-shell {
        padding: 2rem 0.9rem;
        background-position: center top;
    }

    .questions-title {
        font-size: clamp(2.5rem, 14vw, 4.2rem);
    }

    .questions-script-label {
        font-size: clamp(1.8rem, 10vw, 2.5rem);
    }

    .question-card {
        padding: 1.15rem;
    }

    .question-heading-row {
        gap: 0.75rem;
    }

    .question-badge {
        width: 2.1rem;
        height: 2.1rem;
        font-size: 1.25rem;
    }
}

/* SMS Privacy / SMS Terms legal pages — final polished version */

.sms-legal-page {
    position: relative;
    max-width: 1220px;
    margin: 0 auto 3.5rem auto;
    padding: clamp(1.4rem, 3vw, 2.5rem) 1rem;
}

    .sms-legal-page::before,
    .sms-legal-page::after {
        content: "";
        position: absolute;
        z-index: 0;
        pointer-events: none;
    }

    .sms-legal-page::before {
        right: -7vw;
        top: 8rem;
        width: 290px;
        height: 290px;
        border-radius: 50%;
        background: repeating-radial-gradient(circle, rgba(20, 124, 255, 0.14) 0 1px, transparent 2px 12px);
        opacity: 0.48;
    }

    .sms-legal-page::after {
        left: -8vw;
        bottom: 4rem;
        width: 240px;
        height: 240px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(91, 75, 255, 0.10), transparent 68%);
    }

.sms-legal-card {
    position: relative;
    z-index: 1;
    overflow: hidden;
    max-width: 1180px;
    margin: 0 auto;
    padding: clamp(1.45rem, 3vw, 2.15rem);
    border: 1px solid rgba(15, 35, 75, 0.10);
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 26px 80px rgba(6, 23, 53, 0.13);
    backdrop-filter: blur(18px);
}

    .sms-legal-card::before {
        content: "";
        position: absolute;
        top: -140px;
        right: -120px;
        width: 380px;
        height: 380px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(20, 124, 255, 0.11), transparent 68%);
        pointer-events: none;
    }

.sms-legal-hero {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    gap: 1.05rem;
    margin-bottom: 1.15rem;
}

.sms-legal-hero-icon,
.sms-legal-row-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 50%;
    color: var(--ve-bright-blue);
    background: linear-gradient(145deg, rgba(20, 124, 255, 0.12), rgba(91, 75, 255, 0.07));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.sms-legal-hero-icon {
    width: 52px;
    height: 52px;
    margin-top: 0.2rem;
}

.sms-legal-row-icon {
    width: 48px;
    height: 48px;
    margin-top: 0.05rem;
}

    .sms-legal-hero-icon svg,
    .sms-legal-row-icon svg {
        width: 24px;
        height: 24px;
        stroke: currentColor;
        stroke-width: 2;
        fill: none;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.sms-legal-eyebrow {
    margin: 0 0 0.25rem 0;
    color: var(--ve-bright-blue);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.sms-legal-card h1 {
    margin: 0;
    color: var(--ve-navy);
    font-size: clamp(2.35rem, 4vw, 3.65rem);
    font-weight: 850;
    letter-spacing: -0.045em;
    line-height: 1.02;
}

.sms-legal-title-rule {
    width: 54px;
    height: 4px;
    margin-top: 1.05rem;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--ve-bright-blue), var(--ve-purple));
}

.sms-legal-intro {
    position: relative;
    z-index: 1;
    max-width: 1020px;
    margin: 0 0 1.25rem 0;
    color: var(--ve-text);
    font-size: 1.02rem;
    line-height: 1.7;
}

.sms-legal-list {
    position: relative;
    z-index: 1;
    border-top: 1px solid rgba(15, 35, 75, 0.10);
}

.sms-legal-row {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 1.15rem;
    padding: 1.25rem 0;
    border-bottom: 1px solid rgba(15, 35, 75, 0.10);
}

    .sms-legal-row h2 {
        margin: 0 0 0.38rem 0;
        color: var(--ve-navy);
        font-size: clamp(1.05rem, 1.55vw, 1.24rem);
        font-weight: 800;
        letter-spacing: -0.02em;
    }

    .sms-legal-row p {
        max-width: 1030px;
        margin: 0.16rem 0 0 0;
        color: var(--ve-text);
        font-size: 0.97rem;
        line-height: 1.62;
    }

    .sms-legal-row a {
        color: var(--ve-bright-blue);
        font-weight: 650;
    }

.sms-legal-home-link {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 1.05rem;
    color: var(--ve-bright-blue);
    font-weight: 800;
    text-decoration: none;
}

    .sms-legal-home-link:hover {
        color: var(--ve-blue);
        text-decoration: underline;
    }

@media (max-width: 768px) {
    .sms-legal-page {
        padding: 0.75rem 0.75rem 2rem 0.75rem;
    }

    .sms-legal-card {
        padding: 1.2rem;
        border-radius: 22px;
    }

    .sms-legal-hero {
        gap: 0.8rem;
    }

    .sms-legal-hero-icon {
        width: 44px;
        height: 44px;
    }

    .sms-legal-card h1 {
        font-size: clamp(2rem, 9vw, 2.85rem);
    }

    .sms-legal-row {
        grid-template-columns: 1fr;
        gap: 0.65rem;
        padding: 1.1rem 0;
    }

    .sms-legal-row-icon {
        width: 42px;
        height: 42px;
    }
}

/* Final phone-size Gino demo correction */

@media (max-width: 430px) {
    .gino-stage {
        padding: 0.65rem;
    }

    .gino-portrait-card {
        min-height: 585px;
        border-radius: 22px;
    }

    .gino-mute-button {
        top: 0.9rem;
        right: 0.9rem;
        min-height: 34px;
        padding: 0.42rem 0.62rem;
        font-size: 0.76rem;
    }

    .gino-status-pill {
        top: 0.95rem;
        left: 0.9rem;
        font-size: 0.78rem;
    }

    .gino-language-badge {
        top: 1.15rem;
        left: 50%;
        transform: translateX(-50%);
        min-height: 0;
        padding: 0;
        border-radius: 0;
        font-size: 0.72rem;
        line-height: 1.1;
        text-align: center;
        white-space: nowrap;
    }

    .gino-language-badge-icon {
        display: none;
    }

    .voice-wave {
        right: 0.75rem;
        bottom: 0.85rem;
        transform: scale(0.72);
        transform-origin: right bottom;
    }
}


/* Final phone-size printer proof correction */

@media (max-width: 430px) {
    .printer-proof-overlay {
        inset: 0;
        padding: 0.55rem;
        border-radius: 22px;
        align-items: start;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .printer-proof-card {
        width: 100%;
        max-height: none;
        padding: 0.65rem;
        border-radius: 18px;
    }

    .printer-proof-header {
        display: grid;
        gap: 0.15rem;
        margin-bottom: 0.55rem;
        text-align: center;
    }

        .printer-proof-header span {
            font-size: 0.86rem;
            line-height: 1.15;
        }

        .printer-proof-header small {
            font-size: 0.68rem;
            line-height: 1.1;
        }

    .printer-proof-printers {
        grid-template-columns: 1fr;
        gap: 0.55rem;
    }

    .printer-proof-unit {
        min-height: 235px;
    }

    .printer-slot {
        width: min(82%, 178px);
        height: 162px;
        border-radius: 8px 8px 4px 4px;
    }

    .printer-base {
        width: min(92%, 225px);
        height: 62px;
        padding-bottom: 0.58rem;
        border-radius: 14px 14px 18px 18px;
    }

        .printer-base span {
            font-size: 0.62rem;
        }

    .thermal-ticket {
        width: 138px;
        min-height: 235px;
        padding: 0.5rem 0.45rem 0.7rem 0.45rem;
        font-size: 0.52rem;
        line-height: 1.18;
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.24);
    }

    .ticket-number {
        margin: 0.05rem 0 0.22rem 0;
        font-size: 1.75rem;
    }

    .ticket-mode {
        margin: 0.2rem 0 0.38rem 0;
        font-size: 0.72rem;
    }

    .ticket-heading {
        margin: 0.48rem 0 0.22rem 0;
    }

    .ticket-line,
    .ticket-time,
    .ticket-store {
        margin-bottom: 0.16rem;
    }

    .kitchen-ticket {
        font-size: 0.56rem;
    }

        .kitchen-ticket .ticket-number {
            font-size: 1.95rem;
        }

    .checkout-ticket {
        min-height: 285px;
    }
}

/* Inline transcript mobile sizing */

@media (max-width: 768px) {
    .gino-conversation-area {
        margin-top: 0.85rem;
    }

    .gino-inline-transcript-panel .transcript-header {
        padding: 0.5rem 0.64rem;
        font-size: 0.76rem;
    }

    .gino-inline-transcript-panel .transcript-small {
        display: none;
    }

    .gino-inline-transcript-panel .transcript-log {
        min-height: 126px;
        max-height: 166px;
        padding: 0.58rem;
    }

    .gino-inline-transcript-panel .transcript-line {
        margin-bottom: 0.45rem;
        padding: 0.48rem 0.56rem;
        font-size: 0.74rem;
        line-height: 1.3;
    }
}

@media (max-width: 430px) {
    .gino-inline-transcript-panel .transcript-log {
        min-height: 118px;
        max-height: 154px;
    }
}

    /* Final live transcript polish */

    .gino-conversation-area {
        position: relative;
        z-index: 6;
        width: min(100%, 790px);
        margin-top: 0.95rem;
    }

    .gino-inline-transcript-panel {
        border: 1px solid rgba(7, 26, 61, 0.16);
        border-radius: 22px;
        background: #ffffff;
        box-shadow: 0 18px 38px rgba(0, 0, 0, 0.16);
        overflow: hidden;
    }

        .gino-inline-transcript-panel .transcript-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 0.75rem;
            padding: 0.72rem 0.95rem;
            color: var(--ve-navy);
            background: #f4f7ff;
            border-bottom: 1px solid rgba(7, 26, 61, 0.12);
            font-size: 0.88rem;
            font-weight: 950;
        }

            .gino-inline-transcript-panel .transcript-header > span:first-child {
                color: var(--ve-navy);
                font-size: 0.98rem;
                line-height: 1.05;
                letter-spacing: -0.02em;
            }

        .gino-inline-transcript-panel .transcript-small {
            display: inline-flex;
            align-items: center;
            gap: 0.42rem;
            color: var(--ve-muted);
            font-size: 0.72rem;
            font-weight: 850;
            line-height: 1;
            white-space: nowrap;
        }

            .gino-inline-transcript-panel .transcript-small::before {
                content: "";
                width: 0.45rem;
                height: 0.45rem;
                border-radius: 50%;
                background: #34e184;
                box-shadow: 0 0 10px rgba(52, 225, 132, 0.55);
            }

        .gino-inline-transcript-panel .transcript-log {
            min-height: 156px;
            max-height: 210px;
            padding: 0.72rem 0.9rem;
            color: var(--ve-text);
            background: #ffffff;
            scrollbar-width: thin;
            scrollbar-color: rgba(21, 32, 51, 0.28) transparent;
        }

            .gino-inline-transcript-panel .transcript-log::-webkit-scrollbar {
                width: 6px;
            }

            .gino-inline-transcript-panel .transcript-log::-webkit-scrollbar-track {
                background: transparent;
            }

            .gino-inline-transcript-panel .transcript-log::-webkit-scrollbar-thumb {
                border-radius: 999px;
                background: rgba(21, 32, 51, 0.26);
            }

        .gino-inline-transcript-panel .transcript-line {
            margin: 0 0 0.58rem 0;
            padding: 0.66rem 0.78rem;
            border: 1px solid rgba(7, 26, 61, 0.10);
            border-radius: 14px;
            color: var(--ve-text);
            background: #ffffff !important;
            box-shadow: 0 8px 18px rgba(6, 23, 53, 0.06);
            text-align: left;
        }

            .gino-inline-transcript-panel .transcript-line:last-child {
                margin-bottom: 0;
            }

        .gino-inline-transcript-panel .transcript-original {
            color: var(--ve-text);
            font-weight: 750;
        }

        .gino-inline-transcript-panel .transcript-original-with-speaker {
            display: grid;
            grid-template-columns: 4.8rem minmax(0, 1fr);
            gap: 0.6rem;
            align-items: start;
        }

        .gino-inline-transcript-panel .transcript-speaker {
            color: var(--ve-navy);
            font-weight: 950;
            line-height: 1.35;
            white-space: nowrap;
        }

        .gino-inline-transcript-panel .transcript-message {
            min-width: 0;
            color: var(--ve-text);
            line-height: 1.42;
        }

        .gino-inline-transcript-panel .transcript-system {
            background: #f8fafc !important;
        }

            .gino-inline-transcript-panel .transcript-system .transcript-speaker,
            .gino-inline-transcript-panel .transcript-system .transcript-message {
                color: #5f6b7c;
                font-weight: 750;
            }

        .gino-inline-transcript-panel .transcript-gino {
            background: #f6f9ff !important;
        }

            .gino-inline-transcript-panel .transcript-gino .transcript-speaker {
                color: #0b5ed7;
            }

        .gino-inline-transcript-panel .transcript-user {
            background: #fbfaff !important;
        }

            .gino-inline-transcript-panel .transcript-user .transcript-speaker {
                color: #5b4bff;
            }

        .gino-inline-transcript-panel .transcript-english {
            margin: 0.45rem 0 0 5.4rem;
            padding: 0.48rem 0.62rem;
            border-left: 4px solid rgba(91, 75, 255, 0.30);
            border-top: 0;
            border-radius: 10px;
            color: #46556b;
            background: #f7f9ff;
            font-size: 0.82rem;
            font-weight: 650;
            line-height: 1.42;
        }


/* Smaller, cleaner hangup button */

.stage-hangup-button {
    position: relative;
    z-index: 6;
    width: min(56%, 228px);
    margin-top: 0.82rem;
    margin-bottom: 0.72rem;
    padding: 0.56rem 0.9rem;
    border-radius: 999px;
    font-size: 0.84rem;
    font-weight: 950;
    box-shadow: 0 13px 30px rgba(139, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

/* Smaller, slightly higher Gino text inside the orb */

.gino-orb-button {
    gap: 0.26rem;
}

.gino-orb-name {
    font-size: clamp(1.55rem, 2.72vw, 2.78rem);
    line-height: 0.88;
    transform: translateY(-0.16rem);
}

@media (max-width: 768px) {
    .gino-conversation-area {
        width: min(100%, 92vw);
        margin-top: 0.72rem;
    }

    .gino-inline-transcript-panel {
        border-radius: 18px;
    }

        .gino-inline-transcript-panel .transcript-header {
            padding: 0.52rem 0.66rem;
            gap: 0.45rem;
        }

            .gino-inline-transcript-panel .transcript-header > span:first-child {
                font-size: 0.82rem;
            }

        .gino-inline-transcript-panel .transcript-small {
            display: inline-flex;
            font-size: 0.62rem;
        }

        .gino-inline-transcript-panel .transcript-log {
            min-height: 116px;
            max-height: 142px;
            padding: 0.24rem 0.66rem 0.42rem 0.66rem;
        }

        .gino-inline-transcript-panel .transcript-line {
            padding: 0.46rem 0;
        }

        .gino-inline-transcript-panel .transcript-original-with-speaker {
            grid-template-columns: 3.9rem minmax(0, 1fr);
            gap: 0.38rem;
            font-size: 0.72rem;
        }

        .gino-inline-transcript-panel .transcript-message {
            line-height: 1.28;
        }

        .gino-inline-transcript-panel .transcript-english {
            margin-left: 4.28rem;
            font-size: 0.66rem;
        }

    .stage-hangup-button {
        width: min(60%, 206px);
        margin-top: 0.62rem;
        margin-bottom: 0.66rem;
        padding: 0.5rem 0.78rem;
        font-size: 0.74rem;
    }

    .gino-orb-button {
        gap: 0.18rem;
    }

    .gino-orb-name {
        font-size: 1.42rem;
        line-height: 0.86;
        transform: translateY(-0.14rem);
    }
}

@media (max-width: 430px) {
    .gino-conversation-area {
        margin-top: 0.64rem;
    }

    .gino-inline-transcript-panel .transcript-log {
        min-height: 108px;
        max-height: 132px;
    }

    .gino-inline-transcript-panel .transcript-header {
        padding: 0.46rem 0.58rem;
    }

    .gino-inline-transcript-panel .transcript-small {
        font-size: 0.58rem;
    }

        .gino-inline-transcript-panel .transcript-small::before {
            width: 0.38rem;
            height: 0.38rem;
        }

    .gino-inline-transcript-panel .transcript-line {
        padding: 0.4rem 0;
    }

    .gino-inline-transcript-panel .transcript-original-with-speaker {
        grid-template-columns: 3.55rem minmax(0, 1fr);
        gap: 0.32rem;
        font-size: 0.68rem;
    }

    .gino-inline-transcript-panel .transcript-english {
        margin-left: 3.87rem;
        font-size: 0.62rem;
    }

    .stage-hangup-button {
        width: min(68%, 210px);
        margin-top: 0.62rem;
        padding: 0.5rem 0.78rem;
        font-size: 0.76rem;
    }

    .gino-orb-name {
        font-size: 1.34rem;
        transform: translateY(-0.15rem);
    }
}

/* Final hangup button size and bottom spacing adjustment */

.stage-hangup-button {
    width: min(52%, 210px);
    margin-top: 0.72rem;
    margin-bottom: 0.9rem;
    padding: 0.48rem 0.78rem;
    font-size: 0.78rem;
}

@media (max-width: 768px) {
    .stage-hangup-button {
        width: min(54%, 190px);
        margin-top: 0.56rem;
        margin-bottom: 0.82rem;
        padding: 0.42rem 0.68rem;
        font-size: 0.7rem;
    }
}

@media (max-width: 430px) {
    .stage-hangup-button {
        width: min(52%, 174px);
        margin-top: 0.5rem;
        margin-bottom: 0.78rem;
        padding: 0.38rem 0.62rem;
        font-size: 0.66rem;
    }
}

/* Final phone live-call layout correction */

@media (max-width: 768px) {
    .gino-portrait-card.is-live .gino-orb-zone {
        justify-content: flex-start;
        padding-top: 2.8rem;
        padding-bottom: 1rem;
    }

    .gino-portrait-card.is-live .gino-orb-button {
        width: 122px;
        height: 122px;
    }

    .gino-portrait-card.is-live .gino-orb-face-wrap {
        width: 52px;
        height: 52px;
    }

    .gino-portrait-card.is-live .gino-orb-name {
        font-size: 1.28rem;
        transform: translateY(-0.12rem);
    }

    .gino-portrait-card.is-live .gino-orb-title {
        margin-top: 0.62rem;
        font-size: 1.05rem;
        line-height: 1.05;
    }

    .gino-portrait-card.is-live .gino-orb-subtitle {
        margin-top: 0.18rem;
        font-size: 0.78rem;
    }

    .gino-portrait-card.is-live .gino-demo-only-note {
        margin-top: 0.52rem;
        padding: 0.36rem 0.62rem;
        font-size: 0.62rem;
    }

    .gino-portrait-card.is-live .gino-conversation-area {
        margin-top: 0.52rem;
    }

    .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-log {
        min-height: 92px;
        max-height: 112px;
    }

    .gino-portrait-card.is-live .stage-hangup-button {
        width: min(60%, 220px);
        margin-top: 0.48rem;
        margin-bottom: 0.65rem;
        padding: 0.48rem 0.78rem;
        font-size: 0.78rem;
        transform: none;
    }
}

@media (max-width: 430px) {
    .gino-portrait-card.is-live .gino-orb-zone {
        padding-top: 2.45rem;
        padding-bottom: 0.85rem;
    }

    .gino-portrait-card.is-live .gino-orb-button {
        width: 112px;
        height: 112px;
    }

    .gino-portrait-card.is-live .gino-orb-face-wrap {
        width: 48px;
        height: 48px;
    }

    .gino-portrait-card.is-live .gino-orb-name {
        font-size: 1.18rem;
    }

    .gino-portrait-card.is-live .gino-orb-title {
        margin-top: 0.5rem;
        font-size: 0.94rem;
        line-height: 1.03;
    }

    .gino-portrait-card.is-live .gino-orb-subtitle {
        font-size: 0.72rem;
    }

    .gino-portrait-card.is-live .gino-demo-only-note {
        margin-top: 0.45rem;
        padding: 0.32rem 0.56rem;
        font-size: 0.58rem;
    }

    .gino-portrait-card.is-live .gino-conversation-area {
        margin-top: 0.46rem;
    }

    .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-header {
        padding: 0.4rem 0.56rem;
    }

    .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-log {
        min-height: 82px;
        max-height: 98px;
    }

    .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-line {
        padding: 0.34rem 0;
    }

    .gino-portrait-card.is-live .stage-hangup-button {
        width: min(62%, 210px);
        margin-top: 0.42rem;
        margin-bottom: 0.58rem;
        padding: 0.44rem 0.72rem;
        font-size: 0.74rem;
        transform: none;
    }
}

/* Final mobile active-demo transcript expansion */

@media (max-width: 768px) {
    .gino-portrait-card.is-live {
        min-height: min(760px, calc(100svh - 115px));
    }

        .gino-portrait-card.is-live .gino-language-badge {
            display: none;
        }

        .gino-portrait-card.is-live .gino-orb-zone {
            height: 100%;
            min-height: 0;
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
            padding: 2.55rem 0.85rem 0.85rem 0.85rem;
        }

        .gino-portrait-card.is-live .gino-orb-button {
            width: 112px;
            height: 112px;
            flex: 0 0 auto;
        }

        .gino-portrait-card.is-live .gino-orb-face-wrap {
            width: 48px;
            height: 48px;
        }

        .gino-portrait-card.is-live .gino-orb-name {
            font-size: 1.18rem;
            transform: translateY(-0.12rem);
        }

        .gino-portrait-card.is-live .gino-orb-title {
            margin-top: 0.48rem;
            font-size: 0.94rem;
            line-height: 1.05;
            flex: 0 0 auto;
        }

        .gino-portrait-card.is-live .gino-orb-subtitle {
            margin-top: 0.14rem;
            font-size: 0.72rem;
            flex: 0 0 auto;
        }

        .gino-portrait-card.is-live .gino-demo-only-note {
            margin-top: 0.42rem;
            padding: 0.32rem 0.56rem;
            font-size: 0.58rem;
            flex: 0 0 auto;
        }

        .gino-portrait-card.is-live .gino-conversation-area {
            width: min(100%, 92vw);
            min-height: 0;
            flex: 1 1 auto;
            display: flex;
            flex-direction: column;
            margin-top: 0.48rem;
        }

        .gino-portrait-card.is-live .gino-inline-transcript-panel {
            min-height: 0;
            flex: 1 1 auto;
            display: flex;
            flex-direction: column;
        }

            .gino-portrait-card.is-live .gino-inline-transcript-panel[hidden] {
                display: none;
            }

            .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-header {
                flex: 0 0 auto;
                padding: 0.42rem 0.58rem;
            }

            .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-log {
                min-height: 0;
                max-height: none;
                flex: 1 1 auto;
                padding: 0.5rem 0.62rem;
                overflow-y: auto;
                -webkit-overflow-scrolling: touch;
            }

            .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-line {
                margin-bottom: 0.42rem;
                padding: 0.46rem 0.52rem;
                border-radius: 12px;
            }

        .gino-portrait-card.is-live .stage-hangup-button {
            width: min(58%, 190px);
            margin-top: 0.55rem;
            margin-bottom: 0;
            padding: 0.42rem 0.68rem;
            font-size: 0.72rem;
            flex: 0 0 auto;
            transform: none;
        }
}

@media (max-width: 430px) {
    .gino-portrait-card.is-live {
        min-height: min(720px, calc(100svh - 105px));
    }

        .gino-portrait-card.is-live .gino-orb-zone {
            padding-top: 2.35rem;
            padding-bottom: 0.75rem;
        }

        .gino-portrait-card.is-live .gino-orb-button {
            width: 104px;
            height: 104px;
        }

        .gino-portrait-card.is-live .gino-orb-face-wrap {
            width: 44px;
            height: 44px;
        }

        .gino-portrait-card.is-live .gino-orb-name {
            font-size: 1.08rem;
        }

        .gino-portrait-card.is-live .gino-conversation-area {
            margin-top: 0.42rem;
        }

        .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-header {
            padding: 0.38rem 0.54rem;
        }

            .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-header > span:first-child {
                font-size: 0.78rem;
            }

        .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-small {
            font-size: 0.56rem;
        }

        .gino-portrait-card.is-live .gino-inline-transcript-panel .transcript-line {
            padding: 0.42rem 0.48rem;
        }

        .gino-portrait-card.is-live .stage-hangup-button {
            width: min(58%, 178px);
            margin-top: 0.46rem;
            padding: 0.38rem 0.62rem;
            font-size: 0.68rem;
        }
}

/* Final idle prompt visual cleanup */

.gino-starter-chips {
    gap: 0.45rem 0.55rem;
    margin-top: 1.15rem;
}

    .gino-starter-chips::before {
        content: "Example prompts:";
        flex-basis: 100%;
        margin-bottom: 0.08rem;
        color: rgba(222, 232, 255, 0.58);
        font-size: 0.72rem;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .gino-starter-chips span {
        border: 0;
        border-radius: 0;
        padding: 0.12rem 0.2rem;
        color: rgba(222, 232, 255, 0.72);
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        font-size: 0.78rem;
        font-weight: 800;
        line-height: 1.2;
        cursor: default;
        pointer-events: none;
    }

        .gino-starter-chips span::before {
            content: "“";
            color: rgba(222, 232, 255, 0.34);
        }

        .gino-starter-chips span::after {
            content: "”";
            color: rgba(222, 232, 255, 0.34);
        }

.gino-mute-button {
    border-color: rgba(255, 255, 255, 0.32);
    background: rgba(255, 255, 255, 0.16);
}

.gino-orb-button {
    cursor: pointer;
}

@media (max-width: 768px) {
    .gino-starter-chips {
        gap: 0.32rem 0.42rem;
        margin-top: 0.85rem;
    }

        .gino-starter-chips::before {
            font-size: 0.62rem;
        }

        .gino-starter-chips span {
            padding: 0.08rem 0.12rem;
            font-size: 0.66rem;
        }
}

@media (max-width: 430px) {
    .gino-starter-chips {
        margin-top: 0.72rem;
    }

        .gino-starter-chips::before {
            font-size: 0.58rem;
        }

        .gino-starter-chips span {
            font-size: 0.62rem;
        }
}

/* Languages page */

.languages-page-shell {
    max-width: 1900px;
    margin: -1.2rem auto 2.75rem auto;
    color: var(--ve-navy);
    overflow: hidden;
}

.languages-hero {
    position: relative;
    min-height: clamp(440px, 34vw, 610px);
    display: grid;
    grid-template-columns: minmax(320px, 0.9fr) minmax(480px, 1.35fr);
    gap: clamp(1rem, 2vw, 2.5rem);
    align-items: center;
    padding: clamp(2.2rem, 4vw, 5rem) clamp(1.4rem, 5vw, 7rem);
    border: 1px solid rgba(15, 35, 75, 0.10);
    border-radius: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.48)), radial-gradient(circle at 18% 22%, rgba(217, 235, 246, 0.70), transparent 32%), radial-gradient(circle at 82% 22%, rgba(235, 222, 192, 0.50), transparent 34%), linear-gradient(180deg, #fbf7ef 0%, #f8fbff 48%, #ffffff 100%);
    box-shadow: 0 22px 58px rgba(6, 23, 53, 0.10);
}

    .languages-hero::before {
        content: "";
        position: absolute;
        inset: 0;
        background: url('/Images/pastel_communication_flow_background.png') right center / cover no-repeat;
        opacity: 0.34;
        pointer-events: none;
    }

.languages-hero-copy,
.languages-hero-art {
    position: relative;
    z-index: 1;
}

.languages-hero-copy {
    max-width: 650px;
}

    .languages-hero-copy h1 {
        margin: 0;
        color: var(--ve-navy);
        font-family: Georgia, "Times New Roman", serif;
        font-size: clamp(4.1rem, 7.8vw, 9rem);
        font-weight: 800;
        line-height: 0.92;
        letter-spacing: -0.07em;
    }

.languages-hero-rule {
    width: clamp(58px, 6vw, 96px);
    height: 3px;
    margin: clamp(1rem, 1.5vw, 1.5rem) 0;
    background: linear-gradient(90deg, rgba(184, 132, 54, 0.92), rgba(184, 132, 54, 0.20));
}

.languages-hero-copy p {
    max-width: 560px;
    margin: 0 0 1.05rem 0;
    color: #10254a;
    font-size: clamp(1.14rem, 1.45vw, 1.55rem);
    line-height: 1.48;
    font-weight: 650;
}

    .languages-hero-copy p:last-child {
        margin-bottom: 0;
    }

.languages-hero-copy strong {
    font-weight: 950;
}

.languages-hero-art {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    min-width: 0;
}

    .languages-hero-art img {
        width: min(100%, 960px);
        height: auto;
        display: block;
        filter: drop-shadow(0 18px 30px rgba(6, 23, 53, 0.15));
    }

.languages-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(240px, 1fr));
    gap: clamp(1rem, 1.7vw, 1.45rem);
    max-width: 1650px;
    margin: 2.2rem auto 0 auto;
    padding: 0 clamp(1rem, 3vw, 3rem);
}

.language-card {
    min-height: 150px;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 1.25rem;
    padding: clamp(1rem, 1.6vw, 1.45rem);
    border: 1px solid rgba(15, 35, 75, 0.10);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 16px 34px rgba(6, 23, 53, 0.08);
    backdrop-filter: blur(10px);
}

.language-flag {
    width: 74px;
    height: 74px;
    display: grid;
    place-items: center;
    flex: 0 0 74px;
    border: 1px solid rgba(15, 35, 75, 0.10);
    border-radius: 50%;
    background: #ffffff;
    font-size: 3rem;
    line-height: 1;
    box-shadow: 0 8px 18px rgba(6, 23, 53, 0.09);
    overflow: hidden;
}

.language-script-flag {
    color: #ffffff;
    background: #2f7d48;
    border-color: rgba(47, 125, 72, 0.25);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1rem;
    font-weight: 800;
}

.language-card h2 {
    margin: 0 0 0.35rem 0;
    color: var(--ve-navy);
    font-size: clamp(1.2rem, 1.35vw, 1.55rem);
    font-weight: 950;
    line-height: 1.05;
}

.language-card p {
    margin: 0;
    color: #10254a;
    font-size: clamp(0.92rem, 1vw, 1.05rem);
    line-height: 1.32;
    font-weight: 650;
}

@media (max-width: 1250px) {
    .languages-card-grid {
        grid-template-columns: repeat(3, minmax(240px, 1fr));
    }
}

@media (max-width: 980px) {
    .languages-hero {
        grid-template-columns: 1fr;
        padding: 2.3rem 1.25rem;
    }

    .languages-hero-copy {
        max-width: 760px;
    }

    .languages-hero-art {
        justify-content: center;
    }

        .languages-hero-art img {
            width: min(100%, 760px);
        }

    .languages-card-grid {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
        padding: 0 0.5rem;
    }
}

@media (max-width: 620px) {
    .languages-page-shell {
        margin-top: -0.8rem;
    }

    .languages-hero-copy h1 {
        font-size: clamp(3.4rem, 17vw, 5.3rem);
    }

    .languages-hero-copy p {
        font-size: 1.05rem;
    }

    .languages-card-grid {
        grid-template-columns: 1fr;
    }

    .language-card {
        min-height: 130px;
    }

    .language-flag {
        width: 64px;
        height: 64px;
        font-size: 2.55rem;
    }

    .language-script-flag {
        font-size: 0.85rem;
    }
}



