/* EpicVIN Deal Agent landing — self-contained; remove together with the route + Blade view. */
:root {
    --basic-white: #ffffff;
    --basic-black: #000000;
    --main-blue: #0084ff;
    --main-blue-01: #0084ff1a;
    --dark-blue: #00386c;
    --ghost-blue: #eff7ff;
    --orange: #ffb300;
    --orange-hover: #ffc700;
    --markup: #ff6b5e;
    --green: #00c808;
    --ai: #5b5bd6;
    --dark-grey: #666666;
    --grey: #999999;
    --light-grey: #cccccc;
    --footer-bg: #f8f8f8;
    --ink: #101828;
    --card-radius: 16px;
    --shadow-card: 0 10px 24px rgba(0, 0, 0, 0.08);
    --shadow-btn: 0 10px 15px rgba(0, 0, 0, 0.07);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
    color: var(--basic-black);
    line-height: 1.6;
    letter-spacing: -0.02em;
    background: #fff;
    -webkit-font-smoothing: antialiased;
}

.holder {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 20px;
}

@media (min-width: 768px) {
    .holder { padding: 0 35px; }
}

@media (min-width: 1200px) {
    .holder { padding: 0 50px; }
}

h1, h2, h3 {
    margin: 0;
    line-height: 1.2;
    font-weight: 800;
}

.h-xxl { font-size: clamp(30px, 5vw, 46px); }
.h-l { font-size: clamp(22px, 3.4vw, 31px); }

.eyebrow {
    display: inline-block;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.7px;
    color: var(--main-blue);
}

.lead {
    font-size: clamp(16px, 2.2vw, 19px);
    color: #333;
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 55px;
    padding: 0 30px;
    border: none;
    border-radius: 50px;
    font-family: inherit;
    font-weight: 700;
    font-size: 18px;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.3s ease;
}

.button--main { background: var(--orange); color: #000; box-shadow: var(--shadow-btn); }
.button--main:hover { background: var(--orange-hover); }
.button--accent { background: var(--main-blue); color: #fff; }
.button--accent:hover { background: #0071db; }
.button--ghost { height: 51px; background: transparent; color: var(--dark-grey); border: 2px solid var(--light-grey); font-size: 16px; }
.button--ghost:hover { border-color: #000; color: #000; }
.button--block { width: 100%; }

.section { padding: 56px 0; }

@media (min-width: 992px) {
    .section { padding: 80px 0; }
}

.section__head {
    max-width: 700px;
    margin: 0 auto 40px;
    text-align: center;
}

/* header */
.site-head {
    position: sticky;
    top: 0;
    z-index: 50;
    background: #fff;
    border-bottom: 1px solid #eee;
}

.site-head__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 68px;
}

.site-nav { display: none; gap: 26px; }
@media (min-width: 992px) { .site-nav { display: flex; } }
.site-nav a { color: #000; text-decoration: none; font-weight: 600; font-size: 15px; }
.site-nav a:hover { color: var(--main-blue); }

.head-cta { height: 42px; font-size: 15px; padding: 0 20px; }

/* recaptcha runs for the AI chat but its floating badge is hidden per design */
.grecaptcha-badge { visibility: hidden; }

/* hero */
.hero {
    padding: 44px 0 36px;
    background: linear-gradient(180deg, var(--ghost-blue), #fff);
}

.hero-c {
    max-width: 840px;
    margin: 0 auto;
    text-align: center;
}

.hero-c .eyebrow { margin-bottom: 14px; }
.hero-c h1 { margin: 0 0 16px; }
.hero-c .lead { margin: 0 auto 30px; max-width: 620px; }

.hero-sub {
    max-width: 600px;
    margin: 2px auto 20px;
    font-size: clamp(18px, 2.7vw, 23px);
    font-weight: 800;
    line-height: 1.3;
    color: var(--dark-blue);
}

.ba-thanks { max-width: 620px; margin: 0 auto; padding: 24px 0 40px; text-align: center; }
.ba-thanks__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    margin-bottom: 22px;
    border-radius: 50%;
    background: var(--orange);
    box-shadow: 0 10px 24px rgba(255, 179, 0, 0.32);
}
.ba-thanks h1 { margin: 0 0 16px; }
.ba-thanks .lead { margin: 0 auto 28px; max-width: 540px; }

.askbox { max-width: 720px; margin: 0 auto; }

.askform {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 8px 8px 8px 18px;
    background: #fff;
    border: 1px solid #e2e7ee;
    border-radius: 50px;
    box-shadow: var(--shadow-card);
}

.askform .spark { flex: 0 0 auto; display: flex; color: var(--main-blue); }

.askform input {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: none;
    font-family: inherit;
    font-size: 16px;
    color: var(--ink);
}

.askform .button { flex: 0 0 auto; height: 48px; font-size: 15px; padding: 0 20px; }

.chips {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    margin: 16px 0 0;
}

.chip {
    padding: 9px 16px;
    background: #fff;
    border: 1px solid #e2e7ee;
    border-radius: 50px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    cursor: pointer;
}

.chip:hover { border-color: var(--main-blue); color: var(--main-blue); }

.askhelp { margin: 16px 0 0; font-size: 13.5px; color: var(--grey); }
.askhelp b { color: var(--dark-grey); }

.chat { display: none; text-align: left; }
.msg { display: flex; gap: 10px; margin-bottom: 12px; }
.msg:last-child { margin-bottom: 0; }
.msg--user { justify-content: flex-end; }

.msg__ava {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--main-blue-01);
    color: var(--main-blue);
    font-weight: 800;
    font-size: 11px;
}

.bubble { max-width: 82%; padding: 11px 14px; background: #f1f4f8; border-radius: 14px; font-size: 15px; }
.msg--user .bubble { background: var(--main-blue); color: #fff; }
.chat__cta { margin-top: 10px; }
.bubble--car { max-width: 100%; background: #fff; border: 1px solid #e2e7ee; }
.mycar--inchat { margin: 11px 0; border: 1px solid #e7eaee; border-radius: 14px; overflow: hidden; box-shadow: none; }
.mycar__q { margin: 10px 0 0; font-size: 15px; }
.score { display: flex; align-items: center; gap: 14px; padding: 15px 20px; background: var(--ghost-blue); border-bottom: 1px solid #eef0f2; }
.score__ring { flex: 0 0 auto; width: 60px; height: 60px; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; line-height: 1; box-shadow: 0 6px 14px rgba(0, 0, 0, 0.14); }
.score__ring b { font-size: 21px; font-weight: 800; }
.score__ring span { margin-top: 1px; font-size: 9px; font-weight: 800; opacity: 0.92; }
.score--bad { background: var(--markup); }
.score--ok { background: var(--orange); color: #3a2a00; }
.score--good { background: var(--green); }
.score__txt b { display: block; font-size: 15.5px; }
.score__txt span { font-size: 13px; color: var(--dark-grey); }
.flags .fi--info { background: var(--main-blue-01); color: var(--main-blue); }
.da-dots { display: inline-flex; gap: 3px; align-items: center; padding: 2px 0; }
.da-dots i { width: 5px; height: 5px; border-radius: 50%; background: var(--grey); animation: da-blink 1.2s infinite ease-in-out; }
.da-dots i:nth-child(2) { animation-delay: .2s; }
.da-dots i:nth-child(3) { animation-delay: .4s; }
@keyframes da-blink { 0%, 80%, 100% { opacity: .3; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-2px); } }

/* chat mode: the whole box becomes one window — messages on top, upsell bar, input row at the bottom */
.askform__icon {
    display: none;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 50%;
    background: var(--main-blue);
    color: #fff;
    cursor: pointer;
    transition: background .3s ease;
}
.askform__icon:hover { background: #0071db; }

.askbox.is-chat {
    display: flex;
    flex-direction: column;
    max-width: 720px;
    margin: 0 auto;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e2e7ee;
    border-radius: 18px;
    box-shadow: var(--shadow-card);
}
.askbox.is-chat .chat {
    display: block;
    order: 1;
    max-height: 54vh;
    margin: 0;
    padding: 18px 18px 14px;
    overflow-y: auto;
}
.askbox.is-chat .askform {
    order: 3;
    padding: 10px 10px 10px 16px;
    border: none;
    border-top: 1px solid #eef0f2;
    border-radius: 0;
    box-shadow: none;
}
.askbox.is-chat .askform__send { display: none; }
.askbox.is-chat .askform__icon { display: flex; }
.askbox.is-chat .chips,
.askbox.is-chat .askhelp { display: none; }
.askbox.is-chat.is-loading .upsell,
.askbox.is-chat.is-loading .askform { display: none; }

.askbox .upsell { display: none; }
.askbox.is-chat .upsell {
    order: 2;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 14px;
    border-top: 1px solid #eef0f2;
    background: linear-gradient(90deg, #f4f2ff, #eef4ff);
}
.upsell__spark {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: linear-gradient(135deg, #5b5bd6, var(--main-blue));
    color: #fff;
    box-shadow: 0 4px 10px rgba(91, 91, 214, .28);
}
.upsell__txt { flex: 1; min-width: 0; font-size: 13.5px; line-height: 1.4; color: #3a3550; text-align: left; }
.upsell__txt b { color: var(--ink); font-weight: 800; }
.upsell__cta { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; font-size: 14px; font-weight: 800; color: var(--main-blue); text-decoration: none; white-space: nowrap; }
.upsell__cta:hover { color: #0071db; }

@media (max-width: 640px) {
    .askbox.is-chat .upsell { flex-wrap: wrap; gap: 8px 12px; }
    .askbox.is-chat .upsell__cta { flex: 1 1 100%; }
}

/* "negotiated this week" ticker */
.ticker-wrap { margin-top: 30px; }

.ticker__t {
    margin: 0 0 18px;
    text-align: center;
    font-size: 12.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: var(--grey);
}

.ticker {
    position: relative;
    width: 100%;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

.ticker__track {
    display: flex;
    gap: 16px;
    width: max-content;
    padding: 6px 10px;
    animation: da-ticker 55s linear infinite;
}

.ticker:hover .ticker__track { animation-play-state: paused; }

@keyframes da-ticker {
    to { transform: translateX(-50%); }
}

.tcar {
    flex: 0 0 auto;
    width: 248px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #eef0f2;
    border-radius: 16px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.tcar__img { height: 140px; background: linear-gradient(135deg, #dbeafe, #bfdbfe); }
.tcar__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tcar__b { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; }
.tcar__ymm { font-weight: 800; font-size: 14.5px; line-height: 1.15; }
.tcar__meta { margin-top: 3px; font-size: 12px; color: var(--grey); }
.tcar__saved { flex: 0 0 auto; text-align: right; }
.tcar__saved b { display: block; line-height: 1; color: var(--green); font-weight: 800; font-size: 18px; }
.tcar__saved span { font-size: 10px; color: var(--grey); text-transform: uppercase; letter-spacing: 0.4px; }

/* "your car" — precheck handoff */
.mycar {
    max-width: 600px;
    margin: 6px auto 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e2e7ee;
    border-radius: 20px;
    text-align: left;
}

.flags { list-style: none; display: grid; gap: 12px; margin: 0; padding: 14px 20px 8px; }
.flags li { display: flex; gap: 11px; align-items: flex-start; font-size: 14.5px; }

.flags .fi {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin-top: 1px;
    border-radius: 50%;
    font-weight: 800;
    font-size: 13px;
}

.flags .fi--warn { background: #fff0ee; color: #e0503f; }
.flags li b { font-weight: 800; }
.flags li .sub { font-size: 12.5px; color: var(--grey); }

.mycar__loading { padding: 36px 24px 40px; text-align: center; }
.mycar__loading--full {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 360px;
    padding: 24px;
}
.mycar__loading--full[hidden] { display: none; }

.loader-v2 {
    display: inline-block;
    width: 42px;
    height: 42px;
    border: 3px solid var(--main-blue-01);
    border-top-color: var(--main-blue);
    border-radius: 50%;
    animation: da-spin 0.9s linear infinite;
}

@keyframes da-spin {
    to { transform: rotate(360deg); }
}

.mycar__loadt { margin: 16px 0; font-size: 17px; font-weight: 800; }
.mycar__loadt span { color: var(--main-blue); }
.mycar__steps { display: inline-grid; gap: 9px; margin: 0 auto; padding: 0; list-style: none; text-align: left; }
.mycar__steps li { display: flex; gap: 10px; align-items: center; font-size: 13.5px; color: var(--grey); opacity: 0.4; transition: opacity 0.35s, color 0.35s; }

.mycar__steps li::before {
    content: "";
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    border: 2px solid var(--light-grey);
    border-radius: 50%;
    transition: all 0.35s;
}

.mycar__steps li.done { opacity: 1; color: var(--dark-grey); }
.mycar__steps li.done::before { border-color: var(--green); background: var(--green); }
.mycar__content { animation: da-reveal 0.45s ease; }

@keyframes da-reveal {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: none; }
}

/* footer */
footer { padding: 40px 0; background: var(--footer-bg); color: var(--dark-grey); font-size: 14px; }
.foot-row { display: flex; justify-content: space-between; gap: 18px; flex-wrap: wrap; align-items: center; }
.foot-links { display: flex; gap: 18px; flex-wrap: wrap; }
.foot-links a { color: var(--dark-grey); text-decoration: none; }
.foot-links a:hover { color: var(--main-blue); }
.disclaimer { margin-top: 18px; font-size: 12.5px; color: var(--grey); text-align: center; }

@media (max-width: 640px) {
    .hero { padding: 30px 0 24px; }
    .askform { flex-wrap: wrap; padding: 10px 12px; gap: 8px; border-radius: 16px; }
    .askform input { flex: 1 1 auto; }
    .askform .button { flex: 1 1 100%; width: 100%; height: 46px; }
    .chips { justify-content: center; }
    .tcar { width: 208px; }
    .tcar__img { height: 120px; }
}

/* ---- chunk 2b sections ---- */
.h-xl { font-size: clamp(26px, 4vw, 36px); }
.center { text-align: center; }
.section__head .lead { margin-top: 12px; }
.grid { display: grid; gap: 20px; }
.grid-3 { grid-template-columns: 1fr; }
@media (min-width: 768px) { .grid-3 { grid-template-columns: repeat(3, 1fr); } }

/* how it works — two-column (replay left, copy right) */
.how__grid { display: grid; gap: 30px; align-items: start; }
@media (min-width: 992px) {
    .how__grid { grid-template-columns: 1.22fr .78fr; gap: 48px; }
    .how__grid .how__demo { order: -1; }
    .how__grid .how__copy { padding-top: 4px; }
}
.how__copy .eyebrow { margin-bottom: 6px; }
.how__copy .lead { margin: 0; }
.how__copy p + p { margin-top: 0; }

/* how it works — negotiation demo */
.demo { max-width: 880px; margin: 0 auto; }
.how__grid .demo { max-width: none; width: 100%; margin: 0; }
.dtabs { display: inline-flex; gap: 4px; padding: 5px; background: #e9edf3; border-radius: 50px; }
.dtab { padding: 9px 16px; border: none; background: none; border-radius: 50px; font-family: inherit; font-weight: 700; font-size: 14px; color: var(--dark-grey); cursor: pointer; }
.dtab.is-active { background: #fff; color: #000; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); }
.convo { overflow: hidden; margin-top: 18px; background: #fff; border: 1px solid #e7eaee; border-radius: 18px; box-shadow: var(--shadow-card); }
.convo__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 18px; border-bottom: 1px solid #eef0f2; }
.convo__head .who { font-weight: 800; font-size: 13.5px; color: var(--dark-grey); }
.convo__live { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; color: var(--green); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.5px; }
.convo__live .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px rgba(0, 200, 8, 0.18); }
.convo__body { display: flex; flex-direction: column; gap: 11px; min-height: 240px; padding: 18px; }
.cmsg { display: flex; gap: 9px; max-width: 90%; opacity: 0; transform: translateY(8px); transition: opacity 0.35s ease, transform 0.35s ease; }
.cmsg.show { opacity: 1; transform: none; }
.cmsg--left { align-self: flex-start; }
.cmsg--right { flex-direction: row-reverse; align-self: flex-end; }
.cmsg__ava { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; margin-top: 14px; border-radius: 50%; color: #fff; font-weight: 800; font-size: 10px; }
.cmsg__ava--ai { background: var(--ai); }
.cmsg__ava--epic { background: var(--main-blue); }
.clabel { margin-bottom: 3px; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.4px; color: var(--grey); }
.cmsg--right .clabel { text-align: right; }
.cbubble { padding: 10px 13px; border-radius: 14px; font-size: 14.5px; line-height: 1.45; }
.cbubble--ai { background: #efeaff; color: #332a55; }
.cbubble--epic { background: #e7f2ff; color: #0b3a63; }
.cbubble--dealer { background: #eceff3; color: #374151; }
.cbubble--you { background: var(--main-blue); color: #fff; }
.cfacts { margin-top: 9px; padding: 10px 12px; background: #f6f3ff; border: 1px solid #d8cffb; border-radius: 12px; }
.cfacts__t { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.5px; color: var(--ai); }
.cfacts ul { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.cfacts li { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; line-height: 1.35; color: #3a3550; }
.cfacts li::before { content: ""; flex: 0 0 auto; width: 6px; height: 6px; margin-top: 6px; border-radius: 50%; background: var(--ai); }
.cfacts li b { font-weight: 800; color: #241d40; }
.ccards { display: grid; gap: 7px; margin-top: 9px; }
.ccard { display: flex; gap: 10px; align-items: center; padding: 9px 11px; background: #fff; border: 1px solid #d9e1ea; border-radius: 10px; font-size: 13px; color: #374151; text-align: left; }
.ccard--pick { border-color: var(--green); box-shadow: 0 0 0 2px rgba(0, 200, 8, 0.14); }
.ccard__thumb { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 46px; height: 36px; border-radius: 8px; background: linear-gradient(135deg, #dbeafe, #bfdbfe); color: #60a5fa; }
.ccard__info { flex: 1; min-width: 0; }
.ccard__ymm { font-weight: 800; font-size: 13px; color: var(--dark-blue); }
.ccard__meta { font-size: 11.5px; color: var(--grey); }
.ccard__reasons { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.ccard__reasons span { padding: 2px 8px; background: #eafff0; border-radius: 50px; font-size: 10px; font-weight: 700; color: #0a7a23; }
.ccard__score { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 9px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #000; line-height: 1; }
.ccard__score b { font-size: 15px; font-weight: 800; }
.ccard__score span { font-size: 7px; font-weight: 800; opacity: 0.92; letter-spacing: 0.4px; }
.cresult { align-self: center; display: inline-flex; align-items: center; gap: 9px; padding: 11px 20px; background: #eafff0; border: 1px solid #b9f0c7; border-radius: 50px; font-weight: 800; font-size: 14.5px; color: #0a7a23; text-align: center; opacity: 0; transform: translateY(8px) scale(0.96); transition: opacity 0.4s ease, transform 0.4s ease; }
.cresult.show { opacity: 1; transform: none; }

/* $500 promise */
.promise { color: #fff; text-align: center; background: radial-gradient(720px 380px at 86% 88%, rgba(255, 255, 255, 0.12), transparent 60%), linear-gradient(135deg, #0a4f9e, #0084ff); }
.promise__card { max-width: 940px; margin: 0 auto; padding: 30px 34px; display: grid; gap: 22px; align-items: center; text-align: left; background: #fff; border-radius: 24px; box-shadow: 0 26px 60px rgba(0, 16, 40, 0.28); }
@media (min-width: 760px) { .promise__card { grid-template-columns: 1.55fr 1fr; gap: 42px; padding: 34px 40px; } }
.promise__l .eyebrow { display: inline-flex; align-items: center; gap: 7px; color: var(--main-blue); }
.promise__l h2 { margin: 11px 0 10px; color: #000; }
.promise__l h2 .hl { color: var(--main-blue); }
.promise__l p { margin: 0; color: var(--dark-grey); font-size: 15px; line-height: 1.6; }
.promise__r { text-align: center; }
.promise__r .button { width: 100%; box-shadow: 0 12px 28px rgba(255, 179, 0, 0.32); }
.promise__r .button:hover { transform: translateY(-2px); }
.promise__trust { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; margin-top: 14px; color: var(--dark-grey); font-size: 13px; font-weight: 700; }
.promise__trust span { display: inline-flex; align-items: center; gap: 5px; }
.promise__trust svg { flex: 0 0 auto; }
.promise .micro { margin-top: 18px; font-size: 12.5px; color: #cfe0f5; }

/* how we know — proof */
.know { background: var(--footer-bg); }
.know__grid { display: grid; gap: 28px; align-items: center; }
@media (min-width: 992px) { .know__grid { grid-template-columns: 1fr 1fr; gap: 44px; } }
.badges { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
.badge { padding: 8px 14px; background: #fff; border: 1px solid #e7eaee; border-radius: 50px; font-size: 13px; font-weight: 700; color: var(--dark-blue); }
.proof { padding: 22px; background: #fff; border: 1px solid #e7eaee; border-radius: 18px; }
.proof__t { margin: 0 0 16px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.5px; color: var(--grey); }
.tl { position: relative; margin: 0; padding: 0; list-style: none; }
.tl::before { content: ""; position: absolute; left: 6px; top: 6px; bottom: 22px; width: 2px; background: #e2e8f0; }
.tl__row { position: relative; display: flex; align-items: flex-start; gap: 14px; padding-bottom: 16px; }
.tl__dot { position: relative; z-index: 1; flex: 0 0 auto; width: 14px; height: 14px; margin-top: 3px; border-radius: 50%; background: var(--main-blue); box-shadow: 0 0 0 3px #fff; }
.tl__dot--ask { background: var(--markup); }
.tl__dot--sm { width: 9px; height: 9px; margin-top: 5px; margin-left: 2px; background: #c7d2dd; }
.tl__body { flex: 1; min-width: 0; }
.tl__body b { display: block; font-size: 15.5px; font-weight: 800; }
.tl__when { font-size: 12.5px; font-weight: 700; color: var(--grey); }
.tl__sub { font-size: 14px; color: var(--dark-grey); }
.tl__amt { flex: 0 0 auto; font-size: 15.5px; font-weight: 800; }
.tl__amt--ask { color: var(--markup); }
.tl__amt--sub { font-size: 14px; font-weight: 700; color: var(--dark-grey); }
.proof__foot { display: flex; align-items: center; justify-content: space-between; margin-top: 2px; padding-top: 14px; border-top: 1px dashed #e0e4e8; }
.proof__foot .mk-l { font-weight: 700; color: var(--dark-grey); }
.proof__foot .mk-v { font-size: 22px; font-weight: 800; color: var(--markup); }
.proof__stamp { display: flex; align-items: center; gap: 7px; margin-top: 12px; font-size: 12.5px; color: var(--grey); }

/* two products */
.vs-grid { display: grid; gap: 18px; align-items: stretch; }
@media (min-width: 900px) { .vs-grid { grid-template-columns: 1fr auto 1fr; } }
.vs-divider { display: flex; align-items: center; justify-content: center; }
.vs-divider span { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: #fff; border: 1px solid #e7eaee; border-radius: 50%; font-weight: 800; font-size: 14px; color: var(--grey); box-shadow: var(--shadow-card); }
@media (max-width: 899px) { .vs-divider span { margin: 0 auto; } }
.product { display: flex; flex-direction: column; height: 100%; padding: 28px; background: #fff; border: 1px solid #e7eaee; border-radius: 22px; }
.product--ai { border-top: 5px solid var(--ai); }
.product--concierge { border-top: 5px solid var(--dark-blue); background: linear-gradient(170deg, #f7f9ff, #fff 60%); }
.product__scenario { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 14px; font-size: 14px; font-weight: 800; color: var(--dark-grey); }
.product__scenario .n { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; color: #fff; font-size: 13px; }
.product--ai .product__scenario .n { background: var(--ai); }
.product--concierge .product__scenario .n { background: var(--dark-blue); }
.product__name { font-size: 25px; font-weight: 800; }
.product__kind { font-size: 12.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.6px; color: var(--grey); }
.product__price { margin: 14px 0 0; font-size: clamp(38px, 6vw, 50px); font-weight: 800; line-height: 1; }
.product__price small { font-size: 17px; font-weight: 700; color: var(--grey); }
.product__pricesub { margin-top: 6px; font-size: 13.5px; font-weight: 700; color: var(--dark-grey); }
.product__desc { margin: 14px 0 16px; font-size: 15px; color: var(--dark-grey); }
.product__list { display: grid; gap: 12px; margin: 0 0 18px; padding: 0; list-style: none; }
.product__list li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; }
.product__list li b { font-weight: 800; }
.product__list svg { flex: 0 0 auto; margin-top: 3px; }
.product__badge { display: flex; gap: 8px; align-items: center; margin: 0 0 20px; padding: 11px 14px; border-radius: 12px; font-size: 14px; font-weight: 800; }
.product--ai .product__badge { background: #ececff; color: var(--ai); }
.product--concierge .product__badge { background: var(--ghost-blue); color: var(--dark-blue); }
.product .button { margin-top: auto; }
.price-foot { margin-top: 24px; text-align: center; font-size: 15px; color: var(--dark-grey); }

/* why us */
.why__grid { display: grid; gap: 18px; }
@media (min-width: 900px) { .why__grid { grid-template-columns: 1fr 1fr; gap: 24px; align-items: stretch; } }
.why-card { padding: 26px; border: 1px solid #e7eaee; border-radius: 20px; }
.why-old { background: var(--footer-bg); }
.why-new { background: linear-gradient(170deg, #f3f8ff, #fff 70%); border-color: #cfe6ff; }
.why-card__t { margin: 0 0 16px; font-size: 12.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.6px; }
.why-old .why-card__t { color: var(--grey); }
.why-new .why-card__t { color: var(--main-blue); }
.why-list { display: grid; gap: 13px; margin: 0; padding: 0; list-style: none; }
.why-list li { display: flex; gap: 11px; align-items: flex-start; font-size: 15px; line-height: 1.4; }
.why-list .ic { flex: 0 0 auto; margin-top: 1px; font-weight: 800; }
.why-old .why-list li { color: var(--dark-grey); }
.why-old .why-list .ic { color: var(--grey); }
.why-new .why-list .ic { color: var(--green); }
.why-new .why-list li b { font-weight: 800; color: var(--basic-black); }
.why-foot { margin-top: 18px; font-size: 14px; font-weight: 800; }
.why-old .why-foot { color: var(--grey); }
.why-new .why-foot { color: var(--dark-blue); }

/* testimonials */
.tcard { padding: 22px; background: #fff; border: 1px solid #eef0f2; border-radius: var(--card-radius); }
.tcard__save { font-size: 22px; font-weight: 800; color: var(--green); }
.tcard__txt { margin: 8px 0 14px; font-size: 15px; color: #333; }
.tcard__who { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--dark-grey); }
.tcard__ava { width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg, #dbeafe, #93c5fd); }
.tnote { margin-top: 18px; text-align: center; font-size: 12.5px; color: var(--grey); }
.logos { display: flex; flex-wrap: wrap; gap: 14px 34px; align-items: center; justify-content: center; margin-top: 26px; font-size: 16px; font-weight: 800; letter-spacing: 0.5px; color: var(--grey); }
.logos span { opacity: 0.65; }

/* faq */
.faq { max-width: 820px; margin: 0 auto; }
.faq__item { overflow: hidden; margin-bottom: 12px; background: #fff; border: 1px solid #e7eaee; border-radius: 14px; }
.faq__q { display: flex; justify-content: space-between; align-items: center; gap: 16px; width: 100%; padding: 18px 20px; border: none; background: none; font-family: inherit; font-weight: 700; font-size: 16.5px; color: #000; text-align: left; cursor: pointer; }
.faq__q .pm { flex: 0 0 auto; font-size: 22px; color: var(--main-blue); transition: transform 0.25s; }
.faq__item.open .pm { transform: rotate(45deg); }
.faq__a { max-height: 0; overflow: hidden; font-size: 15px; color: var(--dark-grey); transition: max-height 0.3s ease; }
.faq__a p { margin: 0; padding: 0 20px 18px; }

/* final */
.final { background: var(--ghost-blue); }
.final__box { padding: 44px 28px; text-align: center; background: #fff; border-radius: 24px; box-shadow: var(--shadow-card); }

@media (max-width: 640px) {
    .product { padding: 22px 18px; }
    .product__price { font-size: 38px; }
    .vs-divider span { margin: 4px auto; }
    .promise__card { padding: 24px 20px; }
    .convo__body { min-height: 0; padding: 16px; }
    .cmsg { max-width: 96%; }
    .convo__head { flex-wrap: wrap; }
    .why-card { padding: 22px 18px; }
}