/* CarTraceAI homepage — compact, evidence-first public family. */

.page-home {
    --home-ink: #17212b;
    --home-text: #3f464e;
    --home-muted: #626a73;
    --home-blue: #1674d4;
    --home-blue-deep: #1269c4;
    --home-line: #dfe4ea;
    --home-line-strong: #cbd3dc;
    --home-soft: #f7f9fb;
    --home-blue-soft: #eef6ff;
    --home-green: #15965e;
    /* Surface elevation and the owner's quiet aurora accent are shared. */
    --home-preview-shadow: 0 12px 32px rgb(6 24 45 / 8%);
    background: #ffffff;
    color: var(--home-text);
}

.page-home main {
    background: #ffffff;
    color: var(--home-text);
    font-family: var(--public-display-font, var(--font-sans));
    font-size: 1rem;
    line-height: 1.5;
}

.page-home main :is(h1, h2, h3) {
    margin-block-start: 0;
    color: var(--home-ink);
    font-family: inherit;
    font-weight: 600;
    text-wrap: balance;
}

.page-home main h1 {
    max-width: 100%;
    margin-block-end: 0;
    font-size: clamp(2rem, calc(1.5rem + 1.4vw), 2.75rem);
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 1.08;
}

.page-home main h2 {
    margin-block-end: 0.65rem;
    font-size: 1.5rem;
    letter-spacing: -0.015em;
    line-height: 2rem;
}

.page-home main h3 {
    margin-block-end: 0.25rem;
    font-size: 1.125rem;
    line-height: 1.75rem;
}

.page-home main p {
    font-size: 1rem;
}

.page-home .eyebrow {
    display: flex;
    align-items: center;
    gap: 0;
    margin: 0 0 0.75rem;
    color: var(--home-blue);
    font-size: var(--public-text-caption);
    font-weight: var(--public-label-weight);
    letter-spacing: 0.01em;
    line-height: 1.25rem;
    text-transform: none;
}

.page-home .eyebrow > span {
    display: none;
}

.page-home .section {
    padding-block: clamp(2.5rem, 4vw, 3.125rem);
}

.page-home .section-heading {
    max-width: 42rem;
    margin-block-end: 1.5rem;
}

.page-home .section-heading > p:last-child {
    max-width: 40rem;
    margin: 0;
    color: var(--home-muted);
    line-height: 1.6;
}

.page-home .section-heading--center {
    margin-inline: auto;
    text-align: center;
}

.page-home .section-heading--center .eyebrow {
    justify-content: center;
}

/* Hero */

.page-home .home-hero {
    padding-block: clamp(3rem, 5.25vw, 4.5rem) 0;
    border-bottom: 1px solid var(--home-line);
    background: #ffffff;
}

.page-home .home-hero__grid {
    display: grid;
    min-width: 0;
    align-items: center;
    gap: clamp(2.25rem, 4.25vw, 3.875rem);
    grid-template-areas:
        "copy"
        "visual";
}

.page-home .home-hero__copy,
.page-home .home-hero__visual {
    min-width: 0;
}

.page-home .home-hero__copy {
    grid-area: copy;
}

.page-home .home-hero__visual {
    grid-area: visual;
}

.page-home .home-hero__headline > span,
.page-home .home-hero__headline > strong {
    display: block;
    font: inherit;
    overflow-wrap: normal;
    word-break: normal;
}

.page-home .home-hero__headline > strong {
    color: var(--home-blue-deep);
    font-weight: 700;
}

.page-home .home-hero__copy .lead {
    max-width: 31rem;
    margin: 0.875rem 0 1.25rem;
    color: var(--home-text);
    font-size: 1rem;
    line-height: 1.65;
}

.page-home .home-hero__search {
    width: 100%;
    max-width: 36rem;
    padding: 0;
    border: 0;
    background: transparent;
}

/* One entry surface, with the secondary route outside its boundary. */
.page-home .home-hero__search .vin-entry .vin-entry__label-row > label {
    color: var(--home-ink);
    font-weight: 650;
}

.page-home .home-hero__search .vin-entry .vin-input-group {
    border-color: transparent;
    background: transparent;
    grid-template-columns: auto minmax(0, 1fr);
}

.page-home .home-hero .vin-entry__controls {
    padding: 0.5rem;
    border: 1px solid var(--home-line);
    border-radius: 1rem;
    background: rgb(255 255 255 / 94%);
    gap: 0.5rem;
}

.page-home .home-hero .vin-entry .vin-input-group,
.page-home .home-hero .search-panel .vin-entry .button--search {
    border-radius: 0.75rem;
}

.page-home .home-hero .search-panel .vin-entry .button--search {
    margin-inline-start: 0;
}

.page-home .home-hero__search .vin-entry .vin-input-group__icon,
.page-home .home-hero__search .vin-entry .button--search__icon {
    display: inline-grid;
}

.page-home .home-hero__search .vin-entry .vin-input {
    padding-inline-start: 0.625rem;
}

.page-home .home-hero__search .vin-entry .button--search {
    height: auto;
    min-height: 3.5rem;
    gap: 0.625rem;
    padding-block: 0.875rem;
    white-space: normal;
}

.page-home .home-hero__search .vin-entry .vin-input-group:focus-within {
    border-color: var(--home-blue);
}

.page-home .home-hero__search .vin-entry .vin-input-group:has(.vin-input[aria-invalid="true"]) {
    border-color: var(--vin-error);
    background: var(--vin-error-soft);
}

.page-home .home-hero__pricing {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    margin-block-start: 0.375rem;
    gap: 0.625rem;
    color: var(--home-blue-deep);
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    white-space: normal;
}

.page-home .home-hero__pricing .process-grid__action-icon {
    flex: 0 0 auto;
}

.page-home .home-hero__pricing:hover {
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.page-home .hero-illustrative-note {
    display: flex;
    max-width: 32rem;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0.75rem 0 0;
    color: var(--home-muted);
    font-size: var(--public-text-support);
    line-height: var(--public-leading-support);
}

.page-home .hero-illustrative-note :is(span, strong, a) {
    font-size: inherit;
}

.page-home .hero-illustrative-note .icon {
    flex: 0 0 auto;
    color: var(--home-blue);
}

/* The source band owns both insets; the hero adds no extra space below it. */

.page-home .home-source-band {
    display: grid;
    min-width: 0;
    gap: 1.5rem;
    margin-block-start: clamp(1.75rem, 3vw, 2.5rem);
    padding-block: 1.5rem;
    border: 0;
    border-block-start: 1px solid var(--home-line);
    border-radius: 0;
    background: #ffffff;
    box-shadow: none;
}

.page-home .home-source-band__intro {
    min-width: 0;
}

.page-home .home-source-band__intro h2 {
    margin: 0;
    font-size: 1rem;
    line-height: 1.4;
}

.page-home .home-source-band__sources {
    display: grid;
    min-width: 0;
    gap: 1.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.page-home .home-source-band__sources li {
    display: grid;
    grid-template-columns: var(--icon-size-feature) minmax(0, 1fr);
    min-width: 0;
    align-items: start;
    gap: 0.7rem;
    margin: 0;
}

.page-home .home-source-band__history-source {
    opacity: 1;
}

.page-home .home-source-band__icon {
    display: inline-flex;
    width: var(--icon-size-feature);
    height: var(--icon-size-feature);
    flex: 0 0 var(--icon-size-feature);
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
}

.page-home .home-source-band__icon--live {
    color: var(--home-green);
}

.page-home .home-source-band__icon--unavailable {
    color: var(--home-muted);
}

.page-home .home-source-band__icon--testing {
    color: #956018;
}

.page-home .home-source-band__icon .ui-icon {
    --ui-icon-size: 1.125rem;
}

.page-home .home-source-band__source {
    display: grid;
    min-width: 0;
    gap: 0.05rem;
    overflow-wrap: anywhere;
}

.page-home .home-source-band__source > span {
    color: var(--home-muted);
    font-size: var(--public-text-caption);
    line-height: 1.45;
}

.page-home .home-source-band__source > strong {
    color: var(--home-ink);
    font-size: 0.875rem;
    font-weight: 650;
    line-height: 1.4;
}

.page-home .home-source-band__source > .home-source-band__status {
    font-size: 0.8125rem;
    line-height: 1.45;
}

/* Owner-selected illustrative photo; the real sample has its own action. */

.page-home .report-preview {
    width: 100%;
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--home-line-strong);
    border-radius: 1.25rem;
    background: #ffffff;
    box-shadow: var(--home-preview-shadow);
}

.page-home .report-preview__action {
    display: inline-flex;
    min-width: 0;
    max-width: 100%;
    min-height: 2.75rem;
    flex: 0 1 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem;
    padding: 0.75rem 1rem;
    border: 0;
    background: transparent;
    color: var(--home-blue-deep);
    font-size: 0.8125rem;
    font-weight: 650;
    line-height: 1.25;
    text-align: start;
    text-decoration: none;
    transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease;
}

.page-home .report-preview__action:hover {
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.page-home .report-preview__action:focus-visible {
    outline: 3px solid rgb(24 120 220 / 32%);
    outline-offset: 3px;
}

.page-home .report-preview__action-icon {
    --ui-icon-size: 1rem;
    flex: 0 0 auto;
    transition: transform 140ms ease;
}

.page-home .report-preview__action:hover .report-preview__action-icon {
    transform: translateX(0.125rem);
}

.page-home .report-preview__vehicle {
    height: auto;
    aspect-ratio: 1448 / 815;
    margin: 0;
    overflow: hidden;
    border: 0;
    background: #eef0f2;
}

.page-home .report-preview__vehicle img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

/* Three-step path */

.page-home #how-it-works {
    background: #ffffff;
}

.page-home .home-path__heading {
    margin-block-end: 1.75rem;
}

.page-home .process-grid,
.page-home .coverage-grid,
.page-home .report-benefits {
    padding: 0;
    list-style: none;
}

.page-home .process-grid {
    position: static;
    display: grid;
    margin: 0;
    border: 0;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.75rem;
}

.page-home .process-grid::before,
.page-home .process-grid > li::after {
    display: none;
    content: none;
}

.page-home .process-grid > li {
    position: relative;
    min-width: 0;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #ffffff;
    box-shadow: none;
    transform: none;
}

.page-home .process-grid__step {
    position: relative;
    display: grid;
    min-height: 0;
    padding: 0;
    border-radius: 0;
    color: inherit;
    grid-template-columns: 2rem minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: start;
    column-gap: 0.75rem;
}

.page-home .process-grid__action-icon {
    --ui-icon-size: 1rem;
    transition: transform 140ms ease;
}

.page-home .process-grid__number {
    position: static;
    color: var(--home-blue-deep);
    font-size: 0.875rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    line-height: 1.75rem;
    grid-row: 1 / span 2;
}

.page-home .process-grid__icon {
    display: grid;
    width: var(--icon-size-feature);
    height: var(--icon-size-feature);
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--home-blue);
    grid-row: 1 / span 2;
    place-items: center;
}

.page-home .process-grid h3 {
    min-width: 0;
    margin: 0 0 0.2rem;
    grid-column: 2;
    hyphens: none;
    overflow-wrap: anywhere;
    word-break: normal;
}

.page-home .process-grid p,
.page-home .coverage-grid p {
    margin: 0;
    color: var(--home-muted);
    font-size: 0.875rem;
    line-height: 1.55;
}

.page-home .process-grid p {
    min-width: 0;
    grid-column: 2;
    overflow-wrap: break-word;
}

/* Coverage */

.page-home .coverage-section {
    border: 0;
    background: #ffffff;
}

.page-home .coverage-layout {
    display: grid;
    min-width: 0;
    align-items: start;
    gap: clamp(2rem, 5vw, 4rem);
}

.page-home .coverage-intro,
.page-home .coverage-grid {
    min-width: 0;
}

.page-home .coverage-intro .section-heading {
    margin-block-end: 1.25rem;
}

.page-home .coverage-note {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--home-muted);
    font-size: 0.8125rem;
    line-height: 1.5;
}

.page-home .coverage-action {
    margin: 1rem 0 0;
}

.page-home .coverage-action a {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 2.75rem;
    color: var(--home-blue-deep);
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
}

.page-home .coverage-action a:hover {
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.page-home .coverage-grid {
    display: grid;
    margin: 0;
    gap: 1.75rem 2rem;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.page-home .coverage-grid article {
    position: static;
    display: grid;
    min-width: 0;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    transform: none;
    grid-template-columns: var(--icon-size-feature) minmax(0, 1fr);
    grid-template-areas: "icon title" "icon copy";
    align-items: start;
    align-content: start;
    grid-template-rows: min-content min-content;
    column-gap: 0.75rem;
    row-gap: 0.375rem;
}

.page-home .coverage-grid__icon {
    display: grid;
    width: var(--icon-size-feature);
    height: var(--icon-size-feature);
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--home-blue);
    grid-area: icon;
    place-items: center;
}

.page-home .coverage-grid__icon .ui-icon {
    --ui-icon-size: var(--icon-size-feature);
}

.page-home .coverage-grid h3 {
    margin: 0;
    grid-area: title;
    overflow-wrap: anywhere;
}

.page-home .coverage-grid p {
    grid-area: copy;
    overflow-wrap: anywhere;
}

/* Pricing */

.page-home #pricing {
    border-top: 1px solid var(--home-line);
    background: var(--home-soft);
}

.page-home .pricing-callout {
    display: grid;
    min-width: 0;
    gap: 1.25rem;
    align-items: center;
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 1px solid var(--home-line-strong);
    border-radius: 0.75rem;
    background: #ffffff;
}

.page-home .pricing-callout__copy,
.page-home .pricing-callout__action {
    min-width: 0;
}

.page-home .pricing-callout__copy .eyebrow {
    margin-block-end: 0.45rem;
}

.page-home .pricing-callout__copy h2 {
    margin: 0;
}

.page-home .pricing-callout__copy > p:last-child,
.page-home .pricing-callout__action > p:not([class]) {
    margin: 0.45rem 0 0;
    color: var(--home-muted);
    font-size: 0.875rem;
    line-height: 1.5;
}

.page-home .pricing-callout__features {
    display: grid;
    min-width: 0;
    gap: 0.65rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.page-home .pricing-callout__features li {
    display: grid;
    min-width: 0;
    align-items: center;
    gap: 0.55rem;
    color: var(--home-text);
    font-size: 0.875rem;
    line-height: 1.45;
    grid-template-columns: auto minmax(0, 1fr);
}

.page-home .pricing-callout__action {
    display: grid;
    gap: 0.5rem;
    text-align: start;
}

.page-home .pricing-callout__action .button {
    min-height: 3rem;
    white-space: normal;
}

.page-home .pricing-section {
    container-type: inline-size;
    max-width: none;
}

.page-home .pricing-callout__feature-icon {
    display: grid;
    width: var(--icon-size-feature);
    height: var(--icon-size-feature);
    border: 0;
    background: transparent;
    color: var(--home-blue);
    place-items: center;
}

/* FAQ */

.page-home .faq-section {
    border-top: 1px solid var(--home-line);
    background: #ffffff;
}

.page-home .faq-grid {
    display: grid;
    align-items: start;
    gap: clamp(2rem, 5vw, 4rem);
}

.page-home .faq-list {
    min-width: 0;
}

.page-home .faq-list details {
    border: 1px solid var(--home-line);
    border-radius: var(--public-radius-card);
    background: #ffffff;
}

.page-home .faq-list details[open] {
    border-color: var(--home-line-strong);
    background: var(--home-soft);
}

.page-home .faq-list details + details {
    margin-block-start: 0.75rem;
}

.page-home .faq-list summary {
    display: flex;
    min-height: 3.5rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem;
    border-radius: inherit;
    color: var(--home-ink);
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.4;
}

.page-home .faq-list summary > span {
    min-width: 0;
}

.page-home .faq-list summary > .ui-icon {
    flex: 0 0 auto;
}

.page-home .faq-list details p {
    margin: 0;
    padding: 0 1rem 1rem;
    color: var(--home-muted);
    font-size: 0.875rem;
    line-height: 1.55;
}

/* Responsive layout */

@media (min-width: 48rem) {
    .page-home .home-source-band__sources {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Share text rows so a translated label never pushes one brand out of line. */
    @supports (grid-template-rows: subgrid) {
        .page-home .home-source-band__sources {
            row-gap: 0.125rem;
        }

        .page-home .home-source-band__sources li,
        .page-home .home-source-band__source {
            grid-row: span 3;
            grid-template-rows: subgrid;
            row-gap: inherit;
        }

        .page-home .home-source-band__source {
            grid-column: 2;
            grid-row: 1 / span 3;
        }

        .page-home .home-source-band__icon {
            grid-column: 1;
            grid-row: 2;
            align-self: center;
        }
    }

    .page-home .coverage-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    @supports (grid-template-rows: subgrid) {
        .page-home .coverage-grid {
            row-gap: 0.375rem;
        }

        .page-home .coverage-grid article {
            grid-row: span 2;
            grid-template-rows: subgrid;
            margin-block-end: 1.75rem;
        }
    }

    .page-home .faq-grid {
        grid-template-columns: minmax(15rem, 0.7fr) minmax(0, 1.3fr);
    }
}

@media (min-width: 64rem) {
    .page-home .process-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .page-home .coverage-layout {
        grid-template-columns: minmax(18rem, 0.72fr) minmax(0, 1.28fr);
    }

    .page-home .pricing-callout {
        grid-template-columns: minmax(18rem, 1.05fr) minmax(18rem, 1fr) minmax(12rem, auto);
    }

    .page-home .pricing-callout__action {
        text-align: start;
    }
}

@media (min-width: 68rem) {
    .page-home .home-hero__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas: "copy visual";
        align-items: center;
    }

    .page-home .home-source-band {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        align-items: center;
    }

    .page-home .home-source-band__sources {
        grid-column: span 2;
    }
}

@media (max-width: 67.99rem) {
    .page-home .home-hero__copy,
    .page-home .home-hero__visual {
        width: 100%;
        max-width: 48rem;
        margin-inline: auto;
    }
}

@media (max-width: 47.99rem) {
    .page-home main h1 {
        max-width: 100%;
        font-size: 2rem;
        letter-spacing: -0.025em;
        line-height: 1.1;
    }

    .page-home main h2 {
        font-size: 1.25rem;
        line-height: 1.75rem;
    }

    .page-home main h3 {
        font-size: 1rem;
        line-height: 1.5rem;
    }

    .page-home .section {
        padding-block: 2.25rem;
    }

    .page-home .home-hero {
        padding-block: 2.5rem 0;
    }

    .page-home .home-hero__grid {
        gap: 1.75rem;
    }

    .page-home .home-source-band {
        margin-block-start: 1.5rem;
    }

    .page-home .home-hero__copy .lead {
        margin-block: 0.85rem 1.25rem;
    }

    .page-home .report-preview__action {
        justify-content: flex-start;
    }

    .page-home .report-preview__vehicle {
        height: auto;
    }

    .page-home .process-grid,
    .page-home .coverage-grid,
    .page-home .faq-grid {
        grid-template-columns: 1fr;
    }

    .page-home .coverage-grid article {
        grid-template-areas: "icon title" "icon copy";
        align-items: start;
        padding: 0;
    }
}

@media (hover: hover) and (pointer: fine) {
    .page-home .faq-list details:hover {
        border-color: var(--home-line-strong);
    }

    .page-home .process-grid > li:hover,
    .page-home .coverage-grid article:hover {
        transform: none;
        box-shadow: none;
    }
}

:lang(ka) .page-home main :is(h1, h2),
:lang(hy) .page-home main :is(h1, h2) {
    letter-spacing: normal;
}

:is(:lang(ka), :lang(hy)) .page-home .home-hero__headline {
    line-height: 1.2;
}

:is(:lang(ru), :lang(ka), :lang(hy)) .page-home .home-hero__headline {
    font-size: clamp(1.875rem, calc(1.5rem + 1.1vw), 2.25rem);
}

@media (max-width: 47.99rem) {
    :is(:lang(ru), :lang(ka), :lang(hy)) .page-home .home-hero__headline {
        font-size: 1.625rem;
    }
}

/* Viewport rem media queries use the browser's initial font size. These local
   containers also respond when readers enlarge text without resizing the
   viewport, before desktop minimum tracks can push controls off the page. */
.page-home .site-header {
    container-type: inline-size;
}

.page-home .site-header__inner,
.page-home .site-header__actions {
    flex-wrap: wrap;
}

.page-home .site-header__actions {
    max-width: 100%;
}

@container (max-width: 72rem) {
    .page-home .site-header__inner {
        display: flex;
        width: min(calc(100% - 32px), var(--public-shell-max));
        justify-content: space-between;
        gap: 0.5rem;
    }

    .page-home .primary-nav { display: none; }
    .page-home .mobile-nav { display: block; }
    .page-home .site-header__actions { gap: 8px; }

    .page-home .mobile-nav > summary,
    .page-home .language-menu > summary {
        min-height: 44px;
        padding: 8px;
        gap: 6px;
    }

    .page-home .site-header__actions .ui-icon { --ui-icon-size: 22px; }
}

@container (max-width: 35rem) {
    .page-home .mobile-nav__label { display: none; }

    .page-home .site-header__actions .site-header__cta {
        width: 44px;
        min-width: 44px;
        height: 44px;
        padding: 0;
    }

    .page-home .site-header__cta-label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }
}

@container (max-width: 58rem) {
    .page-home .pricing-callout {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (prefers-reduced-motion: reduce) {
    .page-home *,
    .page-home *::before,
    .page-home *::after {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }
}

@media (forced-colors: active) {
    .page-home :is(
        .report-preview,
        .home-source-band,
        .process-grid,
        .pricing-callout,
        .faq-list details
    ) {
        border: 1px solid CanvasText;
    }

    .page-home .coverage-note {
        border-inline-start-color: LinkText;
    }

    .page-home .process-grid > li + li {
        border-color: CanvasText;
    }

    .page-home .report-preview__action {
        border-color: LinkText;
        color: LinkText;
    }
}