/* PitchVaani By City v110 — scoped to the dedicated city directory. */
.pv-city-directory-page { background: #f7fafc; }
.pv-city-hero .pv-state-hero-media img { object-position: center 48%; }
.pv-city-state-selector { margin: 0 0 48px; padding: 28px; border: 1px solid #dbe5ee; border-radius: 20px; background: #fff; box-shadow: 0 14px 36px rgba(15, 23, 42, .08); }
.pv-city-state-heading { max-width: 780px; }
.pv-city-state-heading .eyebrow { display: block; margin-bottom: 9px; color: #047857; font-size: 12px; font-weight: 900; letter-spacing: .08em; }
.pv-city-state-heading h2 { margin: 0; color: #0b1120; font-family: "Playfair Display", Georgia, serif; font-size: clamp(27px, 3.2vw, 40px); line-height: 1.14; }
.pv-city-state-heading h2 span { color: #059669; }
.pv-city-state-heading p { margin: 9px 0 0; color: #526071; line-height: 1.65; }
.pv-city-state-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
.pv-city-state-option { min-width: 0; min-height: 68px; padding: 12px 15px; border: 1px solid #cbd5e1; border-radius: 13px; background: #f8fafc; color: #0f172a; text-align: left; transition: transform 160ms cubic-bezier(.23,1,.32,1), border-color 160ms cubic-bezier(.23,1,.32,1), background 160ms cubic-bezier(.23,1,.32,1); }
.pv-city-state-option span, .pv-city-state-option small { display: block; }
.pv-city-state-option span { font-size: 15px; font-weight: 850; }
.pv-city-state-option small { margin-top: 4px; color: #64748b; font-size: 12px; font-weight: 700; }
.pv-city-state-option:hover, .pv-city-state-option:focus-visible { transform: translateY(-2px); border-color: #10b981; outline: none; box-shadow: 0 0 0 3px rgba(16, 185, 129, .16); }
.pv-city-state-option.is-active { border-color: #047857; background: linear-gradient(145deg, #071827 0%, #064e3b 100%); color: #fff; box-shadow: 0 12px 24px rgba(6, 78, 59, .18); }
.pv-city-state-option.is-active small { color: #a7f3d0; }
.pv-city-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.pv-city-card { display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: 1px solid #dbe5ee; border-radius: 18px; background: #fff; box-shadow: 0 14px 34px rgba(15, 23, 42, .09); transition: transform 180ms cubic-bezier(.23,1,.32,1), border-color 180ms cubic-bezier(.23,1,.32,1), box-shadow 180ms cubic-bezier(.23,1,.32,1); }
.pv-city-card:hover, .pv-city-card:focus-within { transform: translateY(-4px); border-color: rgba(16, 185, 129, .72); box-shadow: 0 22px 42px rgba(15, 23, 42, .15); }
.pv-city-card[hidden] { display: none; }
.pv-city-card-image { position: relative; min-height: 188px; overflow: hidden; background: #071827; }
.pv-city-card-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(3, 12, 22, .52) 100%); pointer-events: none; }
.pv-city-card-image img { width: 100%; height: 100%; min-height: 188px; object-fit: cover; transition: transform 220ms cubic-bezier(.23,1,.32,1); }
.pv-city-card:hover .pv-city-card-image img, .pv-city-card:focus-within .pv-city-card-image img { transform: scale(1.035); }
.pv-city-card-image-fallback::before { content: ""; position: absolute; inset: 0; opacity: .72; background-image: radial-gradient(circle at 20% 30%, rgba(74, 222, 128, .24) 0 2px, transparent 3px), linear-gradient(135deg, rgba(16, 185, 129, .18), transparent 58%); background-size: 24px 24px, auto; }
.pv-city-card-image-maharashtra, .pv-city-card-image-gujarat { background: linear-gradient(145deg, #071827, #065f46); }
.pv-city-card-image-karnataka, .pv-city-card-image-telangana { background: linear-gradient(145deg, #0b1120, #0f766e); }
.pv-city-card-image-punjab, .pv-city-card-image-delhi { background: linear-gradient(145deg, #111827, #047857); }
.pv-city-card-image-west-bengal, .pv-city-card-image-uttar-pradesh { background: linear-gradient(145deg, #082f49, #065f46); }
.pv-city-card-fallback { position: relative; z-index: 1; display: grid; min-height: 188px; place-content: center; justify-items: center; gap: 10px; color: #d1fae5; }
.pv-city-card-fallback svg { width: 42px; height: 42px; }
.pv-city-card-fallback span { font-size: 13px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.pv-city-card-content { display: flex; flex: 1; flex-direction: column; padding: 22px; }
.pv-city-card-state { display: inline-flex; align-items: center; gap: 7px; color: #047857; font-size: 12px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.pv-city-card-state svg { width: 15px; height: 15px; }
.pv-city-card-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-top: 10px; }
.pv-city-card-title-row h3 { margin: 0; color: #0f172a; font-family: "Playfair Display", Georgia, serif; font-size: 26px; line-height: 1.18; }
.pv-city-card-title-row > span { flex: 0 0 auto; padding: 6px 8px; border-radius: 999px; background: #ecfdf5; color: #047857; font-size: 11px; font-weight: 900; }
.pv-city-representative { margin: 11px 0 16px; color: #64748b; font-size: 13px; line-height: 1.55; }
.pv-city-representative strong { color: #334155; }
.pv-city-ground-list { display: grid; gap: 9px; margin: 0 0 20px; padding: 0; list-style: none; }
.pv-city-ground-list li { padding: 10px 11px; border: 1px solid #e2e8f0; border-radius: 10px; background: #f8fafc; }
.pv-city-ground-list a { display: block; color: #0f172a; font-size: 13px; font-weight: 850; line-height: 1.35; text-decoration: none; }
.pv-city-ground-list a:hover, .pv-city-ground-list a:focus-visible { color: #047857; text-decoration: underline; }
.pv-city-ground-list span { display: block; margin-top: 3px; color: #64748b; font-size: 11px; line-height: 1.35; }
.pv-city-state-link { display: inline-flex; align-items: center; gap: 7px; margin-top: auto; color: #047857; font-size: 12px; font-weight: 900; letter-spacing: .035em; text-decoration: none; text-transform: uppercase; }
.pv-city-state-link:hover, .pv-city-state-link:focus-visible { color: #064e3b; text-decoration: underline; }
.pv-city-state-link svg { width: 15px; height: 15px; }
@media (max-width: 1050px) { .pv-city-grid, .pv-city-state-options { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .pv-city-state-selector { padding: 20px; } .pv-city-grid, .pv-city-state-options { grid-template-columns: 1fr; } .pv-city-card-image, .pv-city-card-image img, .pv-city-card-fallback { min-height: 176px; } .pv-city-card-content { padding: 20px; } }
@media (prefers-reduced-motion: reduce) { .pv-city-card, .pv-city-card-image img, .pv-city-state-option { transition: none; } }
