/* Strony SEO (historia-serwisowa i podobne) - hero z telefonem, karty na ciemnym tle, wizualizacja sprzedazy */

.aw-seo-hero .aw-hero-copy { max-width: 560px; }
.aw-seo-hero .aw-hero-devices { min-height: 0; }

.aw-seo-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.aw-seo-chips > span { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 999px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); font-size: 13px; font-weight: 600; color: #e2e8f0; }
.aw-seo-chips .aw-seo-chip-dot { width: 6px; height: 6px; border-radius: 999px; background: #34d399; flex-shrink: 0; }

.aw-seo-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 40px; }
.aw-seo-card { padding: 24px; border-radius: 18px; border: 1px solid var(--aw-border); background: var(--aw-paper); }
.aw-seo-card-icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 12px; background: rgba(var(--aw-accent-rgb),.12); color: var(--aw-accent); margin-bottom: 16px; }
.aw-seo-card-icon svg { width: 19px; height: 19px; }
.aw-seo-card h3 { font-size: 16px; letter-spacing: normal; color: var(--aw-ink); }
.aw-seo-card p { margin-top: 8px; font-size: 13px; line-height: 1.65; color: var(--aw-muted); }

.aw-seo-sale-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.aw-seo-sale-list { margin-top: 24px; display: flex; flex-direction: column; gap: 12px; }
.aw-seo-sale-list li { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.6; color: var(--aw-muted); }
.aw-seo-sale-list li svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; color: var(--aw-accent); }

.aw-seo-sale-card { position: relative; border-radius: 20px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.04); overflow: hidden; }
.aw-seo-sale-head { display: flex; align-items: center; gap: 12px; padding: 18px 20px; border-bottom: 1px solid rgba(255,255,255,.06); }
.aw-seo-sale-icon { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 12px; background: rgba(52,211,153,.18); color: #6ee7b7; flex-shrink: 0; }
.aw-seo-sale-icon svg { width: 16px; height: 16px; }
.aw-seo-sale-head p:first-of-type { font-size: 12px; font-weight: 650; color: white; }
.aw-seo-sale-head p:last-of-type { margin-top: 2px; font-size: 11px; color: #94a3b8; }
.aw-seo-sale-badge { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; background: rgba(52,211,153,.16); font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #6ee7b7; }
.aw-seo-sale-badge span { width: 5px; height: 5px; border-radius: 999px; background: #34d399; }
.aw-seo-sale-rows { padding: 6px 20px; }
.aw-seo-sale-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; }
.aw-seo-sale-row + .aw-seo-sale-row { border-top: 1px solid rgba(255,255,255,.06); }
.aw-seo-sale-row .aw-seo-dot { width: 7px; height: 7px; border-radius: 999px; background: #34d399; flex-shrink: 0; }
.aw-seo-sale-row p:first-child { font-size: 12px; font-weight: 650; color: white; }
.aw-seo-sale-row p:last-child { margin-top: 2px; font-size: 11px; color: #64748b; }
.aw-seo-sale-row .aw-seo-cost { margin-left: auto; flex-shrink: 0; font-size: 12px; font-weight: 700; color: #6ee7b7; }
.aw-seo-sale-link { display: flex; align-items: center; gap: 10px; margin: 16px 20px 20px; padding: 12px 14px; border-radius: 14px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); }
.aw-seo-sale-link svg { width: 15px; height: 15px; flex-shrink: 0; color: #34d399; }
.aw-seo-sale-link span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; font-family: monospace; color: #cbd5e1; }
.aw-seo-sale-link strong { flex-shrink: 0; padding: 3px 8px; border-radius: 999px; background: rgba(52,211,153,.18); font-size: 9px; font-weight: 700; color: #6ee7b7; }

.aw-seo-cost-rows { padding: 16px 20px 4px; display: flex; flex-direction: column; gap: 14px; }
.aw-seo-cost-row-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; font-size: 12px; }
.aw-seo-cost-row-head span:first-child { font-weight: 650; color: #cbd5e1; }
.aw-seo-cost-row-head span:last-child { font-weight: 700; color: #6ee7b7; }
.aw-seo-cost-bar { height: 6px; border-radius: 999px; background: rgba(255,255,255,.08); overflow: hidden; }
.aw-seo-cost-bar span { display: block; height: 100%; border-radius: 999px; background: #34d399; }

.aw-seo-stat-row { display: flex; flex-direction: column; gap: 12px; }
.aw-seo-stat-card { display: flex; align-items: center; gap: 18px; padding: 20px; border-radius: 18px; background: var(--aw-paper); border: 1px solid var(--aw-border); box-shadow: 0 2px 12px rgba(15,23,42,.05); }
.aw-seo-stat-card strong { flex-shrink: 0; min-width: 64px; font-size: 24px; font-weight: 800; color: var(--aw-accent); }
.aw-seo-stat-card span { font-size: 14px; line-height: 1.4; color: var(--aw-muted); }

.aw-landing .aw-steps-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 900px) {
    .aw-landing .aw-steps-3 { grid-template-columns: 1fr; }
}

.aw-seo-num-list { counter-reset: aw-seo-num; display: flex; flex-direction: column; gap: 12px; margin-top: 20px; padding: 0; list-style: none; }
.aw-seo-num-list li { counter-increment: aw-seo-num; display: flex; align-items: flex-start; gap: 12px; font-size: 14px; line-height: 1.6; color: var(--aw-muted); }
.aw-seo-num-list li::before { content: counter(aw-seo-num); flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; margin-top: 1px; width: 24px; height: 24px; border-radius: 999px; background: var(--aw-ink); color: white; font-size: 11px; font-weight: 700; }

.aw-seo-note { margin-top: 16px; display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: 12px; background: rgba(var(--aw-accent-rgb),.08); font-size: 13px; line-height: 1.6; color: var(--aw-ink); }
.aw-seo-note svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; color: var(--aw-accent); }

.aw-seo-app-badge { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 999px; background: var(--aw-ink); color: white; font-size: 13px; font-weight: 700; }
.aw-seo-app-badge svg { width: 16px; height: 16px; flex-shrink: 0; }

/* Import illustrations: an exported sheet becomes a vehicle history. */
.aw-import-art { width: 100%; max-width: 580px; margin-inline: auto; }
.aw-import-art > svg { display: block; width: 100%; height: auto; overflow: visible; }
.aw-import-art text { font-family: 'Archivo', Arial, sans-serif; fill: var(--aw-ink); }
.aw-import-art .aw-import-art-source { font-size: 17px; font-weight: 650; }
.aw-import-art .aw-import-art-label { font-size: 9px; font-weight: 600; letter-spacing: 1px; fill: var(--aw-muted); }
.aw-import-art .aw-import-art-data { font-family: monospace; font-size: 11px; fill: var(--aw-muted); }
.aw-import-art .aw-import-art-small { font-size: 10px; fill: var(--aw-muted); }
.aw-import-art .aw-import-art-green { font-size: 10px; font-weight: 600; fill: #047852; }
.aw-import-art .aw-import-art-brand { font-size: 18px; font-weight: 600; fill: white; }
.aw-import-art .aw-import-art-header-note { font-size: 8px; letter-spacing: 1px; fill: #c4d4cb; }
.aw-import-art .aw-import-art-title { font-size: 12px; font-weight: 600; }
.aw-import-art .aw-import-art-amount { font-size: 11px; font-weight: 600; }

/* Illustrative OBD2 scan history. */
.aw-obd-history-art { position: relative; min-width: 0; padding: 12px 0 32px 20px; }
.aw-obd-log { border: 1px solid #d3dfd8; border-radius: 14px; background: white; overflow: hidden; box-shadow: 0 20px 48px -28px #244f3b45; }
.aw-obd-log-header { display: flex; align-items: center; gap: 14px; padding: 24px; background: #202c26; color: white; }
.aw-obd-log-car { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #456452; border-radius: 10px; color: #6ee7b7; flex-shrink: 0; }
.aw-obd-log-car svg { width: 28px; height: 28px; }
.aw-obd-log-overline { display: block; font-size: 9px; letter-spacing: 1.4px; color: #bbd0c3; margin-bottom: 6px; }
.aw-obd-log-header strong { font-size: 17px; font-weight: 600; }
.aw-obd-log-example { margin-left: auto; color: #bbd0c3; font-size: 10px; }
.aw-obd-log-timeline { padding: 26px 26px 0; }
.aw-obd-log-entry { position: relative; padding: 0 0 24px 26px; border-left: 1px solid #d6e7dd; }
.aw-obd-log-entry:last-child { border-left-color: transparent; padding-bottom: 20px; }
.aw-obd-log-dot { position: absolute; left: -5px; top: 4px; width: 9px; height: 9px; border-radius: 50%; background: #bfd3c7; box-shadow: 0 0 0 5px white; }
.aw-obd-log-entry-latest .aw-obd-log-dot { background: #059669; box-shadow: 0 0 0 5px #e7f5ed; }
.aw-obd-log-date { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; font-size: 11px; color: var(--aw-muted); }
.aw-obd-log-date span:last-child { font-variant-numeric: tabular-nums; }
.aw-obd-log-result { margin-top: 12px; padding: 18px; border: 1px solid #c9e5d6; border-radius: 9px; background: #f3faf6; }
.aw-obd-log-result-title { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.aw-obd-log-result-title strong { font-size: 16px; }
.aw-obd-log-result-title > span { font-size: 9px; font-weight: 600; color: #047852; }
.aw-landing .aw-obd-log-result p { font-size: 11px; margin-top: 4px; }
.aw-obd-log-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.aw-obd-log-tags span { padding: 5px 8px; border: 1px solid #d6e7dd; border-radius: 4px; background: white; color: #43584c; font-size: 10px; }
.aw-obd-log-signal { display: flex; align-items: center; gap: 14px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #dfede5; }
.aw-obd-log-signal svg { flex: 1; min-width: 0; height: 38px; }
.aw-obd-log-signal span { font-size: 9px; color: #547360; flex-shrink: 0; }
.aw-obd-log-saved { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 9px; }
.aw-obd-log-saved strong { font-size: 13px; font-weight: 600; }
.aw-obd-log-saved > span { display: inline-flex; align-items: center; gap: 6px; font-size: 10px; color: #547360; }
.aw-obd-log-saved svg { width: 14px; height: 14px; }
.aw-obd-log-footer { display: flex; align-items: center; gap: 8px; padding: 14px 26px 38px; border-top: 1px solid #edf1ee; color: var(--aw-muted); font-size: 10px; }
.aw-obd-log-footer > span { width: 5px; height: 5px; border-radius: 50%; background: #059669; flex-shrink: 0; }
.aw-obd-report-slip { position: relative; display: flex; align-items: center; gap: 12px; width: calc(100% - 40px); margin: -22px 0 0 -20px; padding: 18px 20px; background: white; border: 1px solid #c8dbcf; border-radius: 10px; box-shadow: 0 12px 24px -16px #244f3b50; }
.aw-obd-report-icon { display: grid; place-items: center; width: 40px; height: 44px; background: #e9f4ee; color: #047852; border-radius: 6px; flex-shrink: 0; }
.aw-obd-report-icon svg { width: 24px; height: 24px; }
.aw-obd-report-slip strong { display: block; font-size: 13px; font-weight: 600; }
.aw-obd-report-slip div > span { display: block; margin-top: 5px; font-size: 10px; color: var(--aw-muted); }
.aw-obd-report-share { width: 20px; height: 20px; margin-left: auto; color: #047852; flex-shrink: 0; }
@media (max-width: 600px) {
    .aw-obd-history-art { padding-left: 0; padding-bottom: 0; }
    .aw-obd-log-header { padding: 18px 16px; gap: 10px; }
    .aw-obd-log-header strong { font-size: 14px; }
    .aw-obd-log-overline { font-size: 8px; letter-spacing: .8px; }
    .aw-obd-log-timeline { padding: 22px 16px 0; }
    .aw-obd-log-entry { padding-left: 18px; }
    .aw-obd-log-result { padding: 12px; }
    .aw-obd-log-footer { padding-inline: 16px; }
    .aw-obd-report-slip { width: calc(100% - 16px); margin-inline: auto; padding: 14px 12px; gap: 10px; }
}

/* OBD2 guide: connection diagram followed by four diagnostic topics. */
.aw-obd-learn-grid { display: grid; grid-template-columns: .95fr 1fr 1fr; gap: 24px; align-items: stretch; }
.aw-obd-topic { padding: 28px; border: 1px solid var(--aw-border); border-radius: 12px; background: var(--aw-paper); }
.aw-obd-topic-start { grid-row: span 2; padding: 0 28px 28px; background: var(--aw-soft); }
.aw-obd-topic-head { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.aw-obd-topic-icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; color: #047852; background: #e9f4ee; }
.aw-obd-topic-icon svg { width: 22px; height: 22px; }
.aw-obd-learn .aw-obd-topic-head h3 { font-size: 20px; line-height: 1.3; letter-spacing: -.5px; }
.aw-obd-topic-body { margin-top: 16px; }
.aw-obd-learn .aw-obd-topic-body p { font-size: 13px; line-height: 1.8; }
.aw-obd-topic-body p + p { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--aw-border); }
.aw-obd-topic-body a { display: inline-block; padding-block: 4px; color: #047852; font-size: 13px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: #b6d9c6; }
.aw-obd-topic-body a:hover { text-decoration-color: currentColor; }
.aw-obd-connect { margin: 0 -28px 28px; padding: 24px 20px; border-radius: 11px 11px 0 0; background: #202c26; color: #d8e9df; }
.aw-obd-connect-label { display: block; font-size: 9px; font-weight: 600; letter-spacing: 1.4px; }
.aw-obd-connect svg { display: block; width: 100%; height: auto; margin-block: 12px; }
.aw-obd-connect-caption { display: block; font-size: 11px; color: #bbd0c3; }
@media (max-width: 1150px) {
    .aw-obd-learn-grid { grid-template-columns: 1fr 1fr; }
    .aw-obd-topic-start { grid-column: 1 / -1; grid-row: auto; display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; padding: 28px; }
    .aw-obd-connect { grid-row: span 2; margin: 0; border-radius: 10px; align-self: start; }
    .aw-obd-topic-start .aw-obd-topic-icon { display: none; }
}
@media (max-width: 650px) {
    .aw-obd-learn-grid { grid-template-columns: 1fr; gap: 16px; }
    .aw-obd-topic { padding: 24px; }
    .aw-obd-topic-start { display: block; }
    .aw-obd-connect { margin: -24px -24px 24px; border-radius: 11px 11px 0 0; }
    .aw-obd-topic-head { flex-direction: row; align-items: center; gap: 12px; }
    .aw-obd-topic-icon { flex-shrink: 0; }
    .aw-obd-learn .aw-obd-topic-head h3 { font-size: 18px; }
}

/* Wariant jasny .aw-seo-sale-card/.aw-seo-cost-rows - komponent domyslnie zaprojektowany na ciemne tlo (aw-section-dark); .is-light czyni go samodzielna, jasna karta do uzycia na plain/tinted sekcjach */
.aw-seo-sale-card.is-light { border-color: var(--aw-border); background: white; box-shadow: 0 20px 48px -28px rgba(15,23,42,.18); }
.aw-seo-sale-card.is-light .aw-seo-sale-head { border-bottom-color: var(--aw-border); }
.aw-seo-sale-card.is-light .aw-seo-sale-head p:first-of-type { color: var(--aw-ink); }
.aw-seo-sale-card.is-light .aw-seo-sale-head p:last-of-type { color: var(--aw-muted); }
.aw-seo-sale-card.is-light .aw-seo-sale-row + .aw-seo-sale-row { border-top-color: var(--aw-border); }
.aw-seo-sale-card.is-light .aw-seo-sale-row p:first-child { color: var(--aw-ink); }
.aw-seo-sale-card.is-light .aw-seo-sale-row p:last-child { color: var(--aw-muted); }
.aw-seo-sale-card.is-light .aw-seo-sale-row .aw-seo-cost { color: #047852; }
.aw-seo-sale-card.is-light .aw-seo-sale-link { border-color: var(--aw-border); background: var(--aw-soft); }
.aw-seo-sale-card.is-light .aw-seo-sale-link span { color: var(--aw-muted); }
.aw-seo-sale-card.is-light .aw-seo-sale-link strong { color: #047852; }
.aw-seo-sale-card.is-light .aw-seo-cost-row-head span:first-child { color: var(--aw-ink); }
.aw-seo-sale-card.is-light .aw-seo-cost-row-head span:last-child { color: #047852; }
.aw-seo-sale-card.is-light .aw-seo-cost-bar { background: var(--aw-soft); }

@media (max-width: 1150px) {
    .aw-seo-cards { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
    .aw-seo-sale-grid { grid-template-columns: 1fr; gap: 32px; }
}
