/* Marketing module: vertical landings, city pages, supplier acquisition, admin marketing. Uses design-system tokens only. */
.vf-landing__teaser { position: relative; }
.vf-landing__teaser .invite-card { margin-inline: auto; }
.vf-landing__teaser-link { display: block; text-align: center; margin-top: 1rem; }

.vf-plan-table { width: 100%; border-collapse: collapse; background: var(--vf-paper); border-radius: var(--vf-radius); overflow: hidden; border: 1px solid rgba(201,162,77,.3); font-size: .95rem; }
.vf-plan-table th, .vf-plan-table td { padding: .85rem .9rem; border-bottom: 1px solid rgba(28,43,51,.07); text-align: center; vertical-align: middle; }
.vf-plan-table th:first-child, .vf-plan-table td:first-child { text-align: left; }
.vf-plan-table thead th { background: var(--vf-sand); font-family: var(--vf-font-display); font-size: 1.25rem; font-weight: 600; color: var(--vf-ink); }
.vf-plan-table thead th small { display: block; font-family: var(--vf-font-body); font-size: .78rem; font-weight: 500; color: var(--vf-muted); letter-spacing: .04em; }
.vf-plan-table .is-featured { background: rgba(232,112,95,.06); }
.vf-plan-table tbody tr:last-child td { border-bottom: 0; }
.vf-plan-table .yes { color: var(--vf-success); font-weight: 700; }
.vf-plan-table .no { color: var(--vf-muted); }
.vf-plan-table__wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.vf-qr-steps { display: grid; gap: 1.25rem; }
@media (min-width: 760px) { .vf-qr-steps { grid-template-columns: repeat(3, 1fr); } }
.vf-qr-step { padding: 1.5rem; border-radius: var(--vf-radius); background: var(--vf-paper); border: 1px solid rgba(28,43,51,.06); box-shadow: var(--vf-shadow-soft); }
.vf-qr-step__light { display: inline-flex; gap: .4rem; margin-bottom: .75rem; }
.vf-qr-step__light span { width: 14px; height: 14px; border-radius: 50%; background: rgba(28,43,51,.12); }
.vf-qr-step__light .on-green { background: var(--vf-success); box-shadow: 0 0 0 4px rgba(46,125,91,.18); }
.vf-qr-step__light .on-yellow { background: var(--vf-warning); box-shadow: 0 0 0 4px rgba(201,138,27,.18); }
.vf-qr-step__light .on-red { background: var(--vf-danger); box-shadow: 0 0 0 4px rgba(184,58,43,.18); }

.vf-chips { display: flex; flex-wrap: wrap; gap: .6rem; }
.vf-chip { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem 1rem; border-radius: 999px; background: var(--vf-paper); border: 1px solid rgba(201,162,77,.45); color: var(--vf-ink); font-size: .9rem; font-weight: 500; transition: border-color .2s, transform .2s; }
.vf-chip:hover { border-color: var(--vf-coral); transform: translateY(-2px); color: var(--vf-ink); }
.vf-chip__count { font-size: .75rem; padding: .1rem .5rem; border-radius: 999px; background: var(--vf-petrol-soft); color: var(--vf-petrol); font-weight: 700; }
.vf-chip--muted { border-style: dashed; color: var(--vf-ink-soft); background: transparent; }

.vf-faq { display: grid; gap: .75rem; max-width: 820px; margin-inline: auto; }
.vf-faq details { background: var(--vf-paper); border: 1px solid rgba(28,43,51,.07); border-radius: var(--vf-radius-sm); padding: 0; box-shadow: var(--vf-shadow-soft); }
.vf-faq summary { cursor: pointer; list-style: none; padding: 1rem 1.25rem; font-family: var(--vf-font-display); font-size: 1.25rem; font-weight: 600; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.vf-faq summary::-webkit-details-marker { display: none; }
.vf-faq summary::after { content: "+"; color: var(--vf-gold); font-size: 1.4rem; font-weight: 400; transition: transform .25s var(--vf-ease); }
.vf-faq details[open] summary::after { transform: rotate(45deg); }
.vf-faq details p { padding: 0 1.25rem 1.1rem; margin: 0; color: var(--vf-ink-soft); }

.vf-share { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.vf-share--compact { gap: .4rem; }
.vf-share__label { font-size: .85rem; color: var(--vf-muted); margin-right: .25rem; }

.vf-city-hero { display: grid; gap: 1.5rem; align-items: center; }
@media (min-width: 900px) { .vf-city-hero { grid-template-columns: 1.2fr 1fr; } }
.vf-city-stat { display: grid; gap: .25rem; padding: 1.25rem 1.5rem; border-radius: var(--vf-radius); background: var(--vf-paper); border: 1px solid rgba(201,162,77,.35); }
.vf-city-stat strong { font-family: var(--vf-font-display); font-size: 2.4rem; line-height: 1; color: var(--vf-petrol); }
.vf-city-stat span { font-size: .85rem; color: var(--vf-muted); letter-spacing: .04em; text-transform: uppercase; }
.vf-city-list { display: flex; flex-wrap: wrap; gap: .5rem; }

.vf-empty { padding: 2rem; text-align: center; border: 1px dashed rgba(201,162,77,.6); border-radius: var(--vf-radius); background: var(--vf-paper); color: var(--vf-ink-soft); }
.vf-empty strong { display: block; font-family: var(--vf-font-display); font-size: 1.4rem; margin-bottom: .35rem; color: var(--vf-ink); }

.vf-honest { display: flex; gap: .75rem; align-items: flex-start; padding: 1rem 1.25rem; border-radius: var(--vf-radius-sm); background: var(--vf-petrol-soft); color: var(--vf-petrol-deep); font-size: .92rem; }

/* Admin */
.vf-admin-head { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: flex-end; margin-bottom: 1.25rem; }
.vf-admin-head h1 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.4rem); }
.vf-subnav { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1.5rem; }
.vf-subnav a { padding: .45rem .9rem; border-radius: 999px; font-size: .85rem; font-weight: 600; border: 1px solid rgba(28,43,51,.12); color: var(--vf-ink-soft); background: var(--vf-paper); }
.vf-subnav a.is-active { background: var(--vf-petrol); border-color: var(--vf-petrol); color: #fff; }
.vf-stats { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); margin-bottom: 1.5rem; }
.vf-range { display: flex; flex-wrap: wrap; gap: .6rem; align-items: end; }
.vf-range .field { min-width: 150px; }
.vf-status { display: inline-block; padding: .15rem .6rem; border-radius: 999px; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.vf-status--sent { background: rgba(46,125,91,.12); color: var(--vf-success); }
.vf-status--failed { background: rgba(184,58,43,.12); color: var(--vf-danger); }
.vf-status--skipped { background: rgba(28,43,51,.08); color: var(--vf-muted); }
.vf-status--pending { background: rgba(201,138,27,.14); color: var(--vf-warning); }
.vf-code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85rem; word-break: break-all; background: var(--vf-sand); padding: .75rem 1rem; border-radius: var(--vf-radius-sm); }
.vf-budget-bar { height: 10px; border-radius: 999px; background: rgba(28,43,51,.08); overflow: hidden; margin: .5rem 0; }
.vf-budget-bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--vf-petrol), var(--vf-coral)); }
.vf-config { display: flex; flex-wrap: wrap; gap: .5rem; }
.vf-config .badge { font-size: .75rem; }
