/**
 * location.css — geo landing pages, demo page, breadcrumbs.
 */

.crumbs { padding: .9rem 0; border-bottom: 1px solid var(--line-soft); font-size: .82rem; color: var(--ink-faint); }
.crumbs a { color: var(--brand); font-weight: 600; }
.crumbs a:hover { text-decoration: underline; }
.crumbs span { margin: 0 .35rem; }

.loc-hero {
    padding: clamp(2.5rem, 6vw, 4.5rem) 0;
    background:
        radial-gradient(50rem 24rem at 12% -10%, rgba(124,58,237,.10), transparent 60%),
        radial-gradient(44rem 22rem at 88% 10%, rgba(234,88,12,.10), transparent 60%);
}
.loc-hero h1 { max-width: 22ch; }
.loc-hero__lead { font-size: 1.08rem; color: var(--ink-soft); max-width: 60ch; }
.loc-hero__actions { display: flex; gap: .75rem; flex-wrap: wrap; margin: 1.75rem 0 2rem; }

.loc-facts {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem;
    background: #fff; border: 1px solid var(--line); border-radius: var(--r);
    padding: 1.25rem; box-shadow: var(--shadow); max-width: 46rem;
}
.loc-facts div { text-align: center; }
.loc-facts strong { display: block; font-size: 1.05rem; font-weight: 800; color: var(--ink); letter-spacing: -.02em; }
.loc-facts span { display: block; font-size: .74rem; color: var(--ink-faint); margin-top: .2rem; }

.city-chips { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }
.city-chip {
    background: #fff; border: 1px solid var(--line); border-radius: 999px;
    padding: .45rem 1rem; font-size: .85rem; font-weight: 600; color: var(--ink-soft);
}

/* Demo page */
.demo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; align-items: start; }
.demo-grid h1 { font-size: clamp(1.8rem, 3.6vw, 2.6rem); }
.demo-points { display: flex; flex-direction: column; gap: .9rem; margin: 1.75rem 0; }
.demo-points li {
    display: flex; flex-direction: column; gap: .1rem;
    padding-left: 1.6rem; position: relative;
}
.demo-points li::before {
    content: '✓'; position: absolute; left: 0; top: .05rem;
    color: var(--green); font-weight: 800;
}
.demo-points strong { font-size: .95rem; }
.demo-points span { font-size: .84rem; color: var(--ink-faint); }

.demo-contact { border-top: 1px solid var(--line-soft); padding-top: 1.25rem; }
.demo-contact__label { font-size: .84rem; color: var(--ink-faint); margin-bottom: .6rem; }
.demo-contact__row { display: flex; gap: .6rem; flex-wrap: wrap; }

.demo-card { padding: 2rem; }
.demo-card h2 { font-size: 1.4rem; margin-bottom: .25rem; }
.demo-card__lead { color: var(--ink-faint); font-size: .88rem; margin-bottom: 1.5rem; }
.demo-card__fine { text-align: center; font-size: .76rem; color: var(--ink-faint); margin: .75rem 0 0; }
.demo-card input, .demo-card select, .demo-card textarea { font-size: 16px; min-height: 46px; }

@media (max-width: 900px) {
    .demo-grid { grid-template-columns: 1fr; gap: 2rem; }
    .loc-facts { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .loc-hero__actions .btn { width: 100%; }
    .demo-card { padding: 1.5rem 1.25rem; }
}
