.tags-landing {
    overflow: clip;
    background: #fff;
    color: #173153;
}

.tags-landing .tags-eyebrow {
    margin: 0 0 14px;
    color: #1e6cc9;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .065em;
    text-transform: uppercase;
}

.tags-landing .tags-cta {
    min-height: 55px;
    padding-inline: 27px;
    border-radius: 7px;
    background: #2773db;
    box-shadow: 0 8px 20px rgba(39, 115, 219, .12);
}

.tags-landing .tags-cta svg { width: 18px; height: 18px; }

.tags-hero {
    padding: 57px 0 0;
    background: radial-gradient(circle at 50% 30%, #eff9ff 0, #f8fcff 48%, #fff 88%);
}

.tags-hero-copy { max-width: 740px; margin: 0 auto; text-align: center; }
.tags-hero-copy h1 { margin: 0 0 14px; font-size: clamp(2.55rem, 4.4vw, 4.3rem); line-height: 1.04; letter-spacing: -.055em; }
.tags-hero-lead { max-width: 640px; margin: 0 auto 22px; color: #50677f; font-size: clamp(1rem, 1.3vw, 1.15rem); line-height: 1.55; }
.tags-hero-preview { position: relative; padding-top: 62px; }
.tags-handnote { position: absolute; color: #254160; font: italic 1rem/1.25 Georgia, serif; letter-spacing: .02em; }
.tags-handnote svg { display: block; width: 30px; height: 30px; margin-top: 6px; color: #2773db; stroke-width: 1.3; }
.tags-handnote-left { top: -78px; left: 1%; transform: rotate(-8deg); }
.tags-handnote-right { top: -78px; right: 1%; transform: rotate(6deg); }
.tags-handnote-right svg { margin-left: auto; }

.tags-demo { position: relative; max-width: 1210px; margin: 0 auto 38px; }
.tags-demo-caption, .tags-result-card figcaption { margin: 0 0 10px; color: #657a90; font-size: .73rem; font-weight: 650; text-align: right; }
.tags-demo-shell {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr) 330px;
    min-height: 500px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e3edf5;
    border-radius: 14px;
    box-shadow: 0 24px 56px rgba(35, 80, 121, .11);
}
.tags-demo-nav { display: flex; flex-direction: column; gap: 10px; padding: 18px 11px; border-right: 1px solid #edf2f7; color: #526984; font-size: .72rem; }
.tags-demo-brand { display: flex; align-items: center; gap: 5px; margin: 0 0 19px; color: #173153; font-size: .99rem; font-weight: 800; }
.tags-demo-brand img { width: 25px; height: 25px; object-fit: contain; }
.tags-demo-nav > span { display: flex; align-items: center; min-height: 35px; gap: 10px; padding: 5px 9px; border-radius: 7px; white-space: nowrap; }
.tags-demo-nav > span svg { width: 15px; height: 15px; flex: none; }
.tags-demo-nav > span.is-active { background: #eaf5ff; color: #1867c5; font-weight: 800; }
.tags-demo-main { min-width: 0; padding: 28px 24px 15px; }
.tags-demo-main h2, .tags-demo-panel h2 { margin: 0 0 16px; font-size: 1.09rem; letter-spacing: -.035em; }
.tags-demo-search, .tags-demo-panel-search { display: flex; align-items: center; min-height: 36px; gap: 9px; padding: 0 12px; border: 1px solid #dce8f3; border-radius: 7px; color: #8a9db0; font-size: .72rem; white-space: nowrap; }
.tags-demo-search svg, .tags-demo-panel-search svg { width: 15px; height: 15px; flex: none; }
.tags-demo-table-head, .tags-demo-row { display: grid; grid-template-columns: 27px 82px minmax(0, 1fr) 94px; align-items: center; gap: 8px; }
.tags-demo-table-head { min-height: 40px; margin-top: 9px; border-bottom: 1px solid #e4edf4; color: #647a91; font-size: .66rem; font-weight: 750; }
.tags-demo-table-head span:last-child { text-align: right; }
.tags-demo-row { min-height: 53px; padding: 3px 0; border-bottom: 1px solid #edf2f7; font-size: .72rem; }
.tags-demo-row.is-selected { margin: 0 -9px; padding-inline: 9px; background: #edf6ff; }
.tags-demo-check { display: flex; align-items: center; color: #9aacc0; }
.tags-demo-check svg { width: 16px; height: 16px; }
.tags-demo-row.is-selected .tags-demo-check { color: #2773db; }
.tags-demo-date { color: #536b84; white-space: nowrap; }
.tags-demo-merchant { min-width: 0; }
.tags-demo-merchant strong, .tags-demo-merchant small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tags-demo-merchant strong { font-size: .72rem; line-height: 1.2; }
.tags-demo-merchant small { margin-top: 3px; color: #71869d; font-size: .65rem; }
.tags-demo-amount { color: #c43e3b; font-weight: 800; text-align: right; white-space: nowrap; }
.tags-demo-selection { display: flex; align-items: center; gap: 6px; margin: 16px 0 0; color: #58728d; font-size: .71rem; }
.tags-demo-selection svg { width: 15px; height: 15px; color: #2773db; }
.tags-demo-panel { position: relative; display: flex; flex-direction: column; padding: 24px 18px 18px; border-left: 1px solid #e4edf5; box-shadow: -8px 0 22px rgba(37, 72, 107, .04); }
.tags-demo-panel h2 { display: flex; align-items: center; gap: 10px; }
.tags-demo-panel h2 svg { width: 20px; height: 20px; color: #2773db; }
.tags-demo-panel-search { margin-bottom: 18px; }
.tags-demo-option { display: flex; align-items: center; min-height: 48px; gap: 10px; padding: 7px; border-radius: 7px; font-size: .76rem; }
.tags-demo-option.is-selected { background: #eaf5ff; }
.tags-demo-option svg:first-child { width: 33px; height: 33px; padding: 7px; border-radius: 7px; background: #e5f4f5; color: #1d9b9b; }
.tags-demo-option:nth-of-type(4) svg:first-child { background: #edf0ff; color: #795cd6; }
.tags-demo-option strong { flex: 1; font-size: .74rem; }
.tags-demo-option svg:last-child { width: 19px; height: 19px; color: #a5b5c6; }
.tags-demo-option.is-selected svg:last-child { color: #2773db; }
.tags-demo-create { display: flex; align-items: center; gap: 7px; margin-top: 11px; padding: 13px 6px; border-top: 1px solid #e5edf5; color: #1f70d1; font-size: .72rem; font-weight: 750; }
.tags-demo-create svg { width: 15px; height: 15px; }
.tags-demo-panel-action { margin-top: auto; padding: 12px 10px; border-radius: 7px; background: #2773db; color: #fff; font-size: .77rem; font-weight: 800; text-align: center; }

.tags-steps { padding: 65px 0 74px; background: #fff; }
.tags-section-heading { margin-bottom: 42px; text-align: center; }
.tags-section-heading h2 { margin: 0 0 4px; font-size: clamp(1.85rem, 2.5vw, 2.55rem); }
.tags-section-heading p { margin: 0; color: #60768c; }
.tags-steps-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 46px; max-width: 1000px; margin: 0 auto; padding: 0; list-style: none; text-align: center; }
.tags-steps-list li { position: relative; }
.tags-steps-list li + li::before { position: absolute; top: 29px; right: calc(50% + 36px); width: calc(100% - 26px); height: 1px; background: #b9d6f4; content: ''; }
.tags-step-number { position: relative; z-index: 1; display: grid; width: 61px; height: 61px; margin: 0 auto 11px; place-items: center; border-radius: 50%; background: #eaf5ff; color: #176acb; font-size: 1.5rem; font-weight: 800; }
.tags-steps-list h3 { margin: 0 0 5px; font-size: 1rem; }
.tags-steps-list p { max-width: 270px; margin: 0 auto; color: #60758b; font-size: .89rem; line-height: 1.5; }

.tags-result { padding: 83px 0 90px; background: #f1f9ff; }
.tags-result-grid { display: grid; grid-template-columns: minmax(0, 55%) minmax(0, 45%); align-items: center; gap: 42px; }
.tags-result-preview { position: relative; min-height: 362px; padding: 18px 0 0 120px; }
.tags-result-note { top: 0; left: 0; transform: rotate(-9deg); }
.tags-result-topics { position: absolute; top: 145px; left: 7px; display: flex; flex-direction: column; gap: 11px; }
.tags-result-topics span { display: flex; align-items: center; gap: 8px; min-width: 162px; padding: 9px 11px; border-radius: 8px; background: #fff; box-shadow: 0 8px 22px rgba(35, 80, 121, .08); font-size: .67rem; font-weight: 750; }
.tags-result-topics svg { width: 24px; height: 24px; padding: 4px; border-radius: 6px; background: #e9f4ff; color: #2773db; }
.tags-result-card { position: relative; max-width: 485px; margin: 0; }
.tags-result-card figcaption { text-align: right; }
.tags-result-card-body { overflow: hidden; padding: 23px 26px 15px; border: 1px solid #e5eef6; border-radius: 14px; background: #fff; box-shadow: 0 20px 42px rgba(35, 80, 121, .12); }
.tags-result-card-heading { display: flex; align-items: center; gap: 11px; padding-bottom: 16px; border-bottom: 1px solid #e5edf5; }
.tags-result-house { display: grid; width: 42px; height: 42px; flex: none; place-items: center; border-radius: 9px; background: #dff2f4; color: #168e99; }
.tags-result-house svg { width: 22px; height: 22px; }
.tags-result-card-heading > span:nth-child(2) { min-width: 0; flex: 1; }
.tags-result-card-heading strong, .tags-result-card-heading small { display: block; }
.tags-result-card-heading strong { font-size: .92rem; }
.tags-result-card-heading small { color: #60778e; font-size: .73rem; }
.tags-result-card-heading b { color: #c43e3b; font-size: .86rem; white-space: nowrap; }
.tags-result-list > div { display: grid; grid-template-columns: 92px minmax(0, 1fr) 96px; gap: 9px; padding: 10px 0; border-bottom: 1px solid #e9eff5; font-size: .72rem; }
.tags-result-list time { color: #526c84; white-space: nowrap; }
.tags-result-list strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tags-result-list span { color: #c43e3b; font-weight: 800; text-align: right; white-space: nowrap; }
.tags-result-hint { margin: 13px 0 0; color: #2371ca; font-size: .75rem; font-weight: 750; }
.tags-result-copy { padding-left: 14px; }
.tags-result-copy h2 { max-width: 570px; margin: 0 0 18px; font-size: clamp(2rem, 3vw, 3.2rem); line-height: 1.13; }
.tags-result-copy > p:last-child { max-width: 520px; margin: 0; color: #576d84; font-size: 1.04rem; line-height: 1.62; }

.tags-reassurance { padding: 28px 0 14px; background: #fff; }
.tags-reassurance-inner { display: flex; align-items: center; gap: 24px; padding: 25px 30px; border-radius: 10px; background: #eaf5ff; }
.tags-reassurance-inner > svg { width: 48px; height: 48px; flex: none; padding: 11px; border-radius: 50%; background: #d8eaff; color: #2474d9; }
.tags-reassurance-inner p { max-width: 1010px; margin: 0; color: #486079; font-size: .9rem; line-height: 1.55; }
.tags-reassurance-inner strong { color: #173153; font-size: 1.07rem; }
.tags-final { padding: 12px 0 44px; background: #fff; }
.tags-final-inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 32px 42px; border-radius: 10px; background: #eaf5ff; }
.tags-final-inner h2 { max-width: 680px; margin: 0; font-size: clamp(1.75rem, 2.65vw, 2.7rem); line-height: 1.15; }
.tags-final-action { flex: none; text-align: center; }
.tags-final-action p { margin: 8px 0 0; color: #5d738a; font-size: .76rem; }

@media (max-width: 1000px) {
    .tags-demo-shell { grid-template-columns: minmax(0, 1fr) 285px; }
    .tags-demo-nav { display: none; }
    .tags-handnote-left { left: 0; }
    .tags-handnote-right { right: 0; }
    .tags-result-grid { grid-template-columns: 1fr 1fr; gap: 15px; }
    .tags-result-preview { padding-left: 35px; }
    .tags-result-topics, .tags-result-note { display: none; }
}

@media (max-width: 700px) {
    .tags-hero { padding-top: 48px; }
    .tags-hero-copy h1 { font-size: clamp(2.2rem, 8vw, 3.2rem); }
    .tags-hero-preview { padding-top: 45px; }
    .tags-handnote-left, .tags-handnote-right { display: none; }
    .tags-demo { margin-bottom: 35px; }
    .tags-demo-caption { text-align: left; }
    .tags-demo-shell { grid-template-columns: 1fr; }
    .tags-demo-main { padding: 21px 16px; }
    .tags-demo-panel { min-height: 300px; padding: 19px 16px 16px; border-top: 1px solid #e4edf5; border-left: 0; box-shadow: none; }
    .tags-demo-search { overflow: hidden; text-overflow: ellipsis; }
    .tags-steps { padding: 55px 0 60px; }
    .tags-steps-list { gap: 20px; }
    .tags-steps-list li + li::before { width: calc(100% - 15px); right: calc(50% + 33px); }
    .tags-steps-list p { font-size: .78rem; }
    .tags-result { padding: 62px 0; }
    .tags-result-grid { grid-template-columns: 1fr; gap: 32px; }
    .tags-result-preview { min-height: 0; padding: 0; }
    .tags-result-card { max-width: none; }
    .tags-result-copy { padding-left: 0; }
    .tags-final-inner { flex-direction: column; align-items: flex-start; padding: 27px; }
    .tags-final-action { text-align: left; }
}

@media (max-width: 480px) {
    .tags-landing .container { width: min(calc(100% - 32px), var(--container)); }
    .tags-hero-copy h1 { font-size: 2.12rem; }
    .tags-hero-lead { font-size: .96rem; }
    .tags-demo-table-head, .tags-demo-row { grid-template-columns: 19px 70px minmax(0, 1fr) 73px; gap: 4px; }
    .tags-demo-row { font-size: .63rem; }
    .tags-demo-date, .tags-demo-merchant strong, .tags-demo-amount { font-size: .61rem; }
    .tags-demo-merchant small { font-size: .57rem; }
    .tags-steps-list { grid-template-columns: 1fr; gap: 24px; }
    .tags-steps-list li + li::before { display: none; }
    .tags-step-number { margin-bottom: 7px; }
    .tags-steps-list p { max-width: 290px; font-size: .87rem; }
    .tags-result-card-body { padding: 18px 13px 10px; }
    .tags-result-card-heading b { font-size: .7rem; }
    .tags-result-list > div { grid-template-columns: 76px minmax(0, 1fr) 73px; gap: 5px; font-size: .59rem; }
    .tags-reassurance-inner { align-items: flex-start; gap: 12px; padding: 19px; }
    .tags-reassurance-inner > svg { width: 32px; height: 32px; padding: 7px; }
    .tags-reassurance-inner p { font-size: .81rem; }
    .tags-reassurance-inner strong { font-size: .88rem; }
}