/* LAW_HINDI_CONST_2026: visual explainers for bilingual /law pages */
.lv-h-en { font-size: .68em; font-weight: 500; color: #64748b; margin-left: .35rem; font-family: system-ui, sans-serif; }
.lv-recap { margin: .5rem 0 1.2rem; border-radius: 14px; padding: .85rem 1rem; background: linear-gradient(135deg, #1e3a8a, #4338ca); color: #fff; box-shadow: 0 8px 22px rgba(30, 58, 138, .22); }
.lv-recap-title { font-weight: 800; letter-spacing: .02em; margin-bottom: .35rem; }
.lv-recap ul { margin: 0; padding-left: 1.2rem; }
.lv-recap li { margin: .3rem 0; line-height: 1.65; }
.lv-recap strong { color: #fde68a; }
.lv-hot-row { margin: -.4rem 0 .9rem; }
.lv-hot { display: inline-block; font-size: .78rem; font-weight: 800; color: #9a3412; background: #ffedd5; border: 1px solid #fdba74; border-radius: 999px; padding: .15rem .65rem; }
.lv-quote { margin: 1rem 0; padding: .9rem 1.1rem .8rem 3rem; border-radius: 12px; background: #fdf4ff; border: 1px solid #f0abfc; position: relative; }
.lv-quote::before { content: "\201C"; position: absolute; left: .7rem; top: -.2rem; font: 700 3.2rem/1 Georgia, serif; color: #c026d3; }
.lv-quote p { margin: 0 0 .3rem; font-size: 1.04rem; }
.lv-quote cite { font-size: .8rem; color: #86198f; font-style: normal; }
.lv-timeline { list-style: none; margin: 1rem 0 1.3rem; padding: 0 0 0 1.1rem; border-left: 3px solid #c7d2fe; }
.lv-timeline li { position: relative; padding: 0 0 .9rem 1rem; }
.lv-timeline li::before { content: ""; position: absolute; left: -1.62rem; top: .3rem; width: .85rem; height: .85rem; border-radius: 50%; background: #4338ca; border: 3px solid #fff; box-shadow: 0 0 0 2px #c7d2fe; }
.lv-when { display: inline-block; font-size: .78rem; font-weight: 800; color: #3730a3; background: #eef2ff; border-radius: 6px; padding: .05rem .5rem; margin-bottom: .2rem; }
.lv-what b { display: block; color: #0f172a; }
.lv-what span { display: block; font-size: .9rem; color: #475569; }
.lv-tiles { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); margin: .9rem 0 1.2rem; }
.lv-tiles-3 { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.lv-tile { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: .8rem .9rem; box-shadow: 0 1px 2px rgba(15, 23, 42, .05); transition: transform .15s ease, box-shadow .15s ease; }
.lv-tile:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(15, 23, 42, .08); }
.lv-ico { display: inline-flex; align-items: center; justify-content: center; min-width: 2.3rem; height: 2.3rem; padding: 0 .4rem; border-radius: 10px; background: #eef2ff; font-size: 1.25rem; margin-bottom: .45rem; }
.lv-tiles-num .lv-ico { background: #1e3a8a; color: #fff; font: 800 .95rem/1 system-ui, sans-serif; }
.lv-tile b { display: block; color: #1e3a8a; font-size: 1.02rem; }
.lv-tile small { display: block; color: #64748b; font-size: .78rem; margin-top: .1rem; }
.lv-tile p { margin: .45rem 0 0; font-size: .9rem; line-height: 1.6; color: #1f2937; }
.lv-countries { display: grid; gap: .7rem; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); margin: 1rem 0 1.2rem; }
.lv-country { display: flex; gap: .7rem; align-items: flex-start; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: .75rem .85rem; }
.lv-code { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2.9rem; height: 2.9rem; border-radius: 50%; color: #fff; font: 800 .82rem/1 system-ui, sans-serif; background: #475569; }
.lv-c-gb { background: linear-gradient(135deg, #1e3a8a, #b91c1c); }
.lv-c-us { background: linear-gradient(135deg, #1d4ed8, #dc2626); }
.lv-c-ca { background: #dc2626; }
.lv-c-ie { background: linear-gradient(135deg, #16a34a, #f97316); }
.lv-c-au { background: #1e40af; }
.lv-c-za { background: linear-gradient(135deg, #15803d, #facc15); color: #111; }
.lv-c-su { background: #b91c1c; }
.lv-c-de { background: linear-gradient(180deg, #111 33%, #dc2626 33% 66%, #f59e0b 66%); }
.lv-c-fr { background: linear-gradient(90deg, #1d4ed8 33%, #fff 33% 66%, #dc2626 66%); color: #111; text-shadow: 0 0 3px #fff; }
.lv-c-in { background: linear-gradient(180deg, #f97316 33%, #fff 33% 66%, #16a34a 66%); color: #1e3a8a; font-size: .74rem; }
.lv-country-body b { display: block; color: #0f172a; }
.lv-country-body small { color: #64748b; font-size: .76rem; }
.lv-country-body p { margin: .3rem 0 0; font-size: .9rem; line-height: 1.6; }
.lv-chips { display: flex; flex-wrap: wrap; gap: .55rem; margin: .7rem 0 1rem; }
.lv-chip { flex: 1 1 140px; text-align: center; border-radius: 12px; padding: .7rem .6rem; background: linear-gradient(180deg, #fff7ed, #ffedd5); border: 1px solid #fdba74; }
.lv-chip b { display: block; font-size: 1.12rem; color: #9a3412; }
.lv-chip small { display: block; font-size: .76rem; color: #7c2d12; margin-top: .15rem; }
.lv-stats { display: grid; gap: .7rem; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin: .8rem 0 1.1rem; }
.lv-stat { border-radius: 14px; padding: .85rem; text-align: center; background: linear-gradient(180deg, #f0fdfa, #fff); border: 1px solid #99f6e4; }
.lv-stat small { display: block; font-weight: 700; color: #0f766e; }
.lv-stat-row { display: flex; align-items: baseline; justify-content: center; gap: .5rem; margin: .25rem 0; }
.lv-then { font-size: 1.4rem; color: #64748b; text-decoration: line-through; text-decoration-color: #94a3b8; }
.lv-now { font-size: 2.1rem; font-weight: 800; color: #0f766e; }
.lv-stat-arrow { color: #94a3b8; }
.lv-stat em { font-size: .72rem; color: #64748b; font-style: normal; }
.lv-steps { display: flex; flex-wrap: wrap; align-items: stretch; gap: .45rem; margin: .9rem 0 1.1rem; }
.lv-step { flex: 1 1 170px; border-radius: 12px; padding: .75rem .85rem; background: #f8fafc; border: 1px solid #cbd5e1; }
.lv-step:last-child { background: #ecfdf5; border-color: #6ee7b7; }
.lv-step-n { display: inline-flex; width: 1.6rem; height: 1.6rem; border-radius: 50%; align-items: center; justify-content: center; background: #1e3a8a; color: #fff; font: 800 .8rem/1 system-ui, sans-serif; margin-bottom: .35rem; }
.lv-step:last-child .lv-step-n { background: #059669; }
.lv-step b { display: block; color: #0f172a; }
.lv-step small { display: block; color: #475569; font-size: .84rem; line-height: 1.5; }
.lv-arrow { align-self: center; color: #94a3b8; font-weight: 800; font-size: 1.2rem; }
.lv-ladder { display: flex; flex-direction: column; gap: .5rem; margin: 1rem 0 1.1rem; }
.lv-rung { display: flex; gap: .75rem; align-items: flex-start; border-radius: 12px; padding: .75rem .9rem; border: 1px solid #e2e8f0; background: #fff; }
.lv-rung-1 { margin-right: 18%; border-left: 5px solid #22c55e; }
.lv-rung-2 { margin-left: 9%; margin-right: 9%; border-left: 5px solid #f59e0b; }
.lv-rung-3 { margin-left: 18%; border-left: 5px solid #dc2626; }
.lv-rung-n { flex: none; width: 2rem; height: 2rem; border-radius: 8px; background: #0f172a; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; }
.lv-rung b { display: block; color: #0f172a; }
.lv-rung small { display: block; color: #64748b; font-size: .8rem; }
.lv-rung p { margin: .3rem 0 0; font-size: .9rem; }
.lv-triangle { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin: 1rem 0 1.2rem; padding: .9rem; border-radius: 14px; background: #fffbeb; border: 1px solid #fde68a; }
.lv-triangle svg { width: 220px; max-width: 100%; height: auto; flex: none; }
.lv-tri-key { flex: 1 1 220px; display: flex; flex-direction: column; gap: .4rem; }
.lv-tri-key b { display: inline-flex; width: 1.7rem; height: 1.7rem; border-radius: 50%; align-items: center; justify-content: center; color: #fff; margin-right: .4rem; font-size: .8rem; }
.lv-k21 { background: #b91c1c; } .lv-k14 { background: #1d4ed8; } .lv-k19 { background: #15803d; }
.lv-tri-key em { font-size: .86rem; color: #92400e; margin-top: .3rem; }
.lv-map { display: grid; gap: .5rem; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); margin: .9rem 0 1.2rem; }
.lv-map-item { display: flex; flex-direction: column; gap: .1rem; text-decoration: none; border-radius: 12px; padding: .65rem .75rem; background: #fff; border: 1px solid #e2e8f0; color: inherit; transition: border-color .15s ease, transform .15s ease; }
.lv-map-item:hover, .lv-map-item:focus { border-color: #6366f1; transform: translateY(-2px); }
.lv-map-item span { font-size: 1.3rem; }
.lv-map-item b { color: #1e3a8a; }
.lv-map-item small { color: #64748b; font-size: .76rem; }
.lv-bridge-head { margin: 1.3rem 0 0; padding: .7rem .9rem; border-radius: 12px; background: linear-gradient(90deg, #ecfeff, #f5f3ff); border: 1px solid #c4b5fd; }
.lv-bridge-head b { display: block; color: #4c1d95; font-size: 1.05rem; }
.lv-bridge-head span { font-size: .86rem; color: #475569; }
@media (max-width: 640px) {
  .lv-rung-1, .lv-rung-2, .lv-rung-3 { margin-left: 0; margin-right: 0; }
  .lv-arrow { transform: rotate(90deg); width: 100%; text-align: center; }
  .lv-step { flex-basis: 100%; }
  .lv-triangle svg { width: 180px; margin: 0 auto; }
}
@media (prefers-reduced-motion: reduce) { .lv-tile, .lv-map-item { transition: none; } .lv-tile:hover, .lv-map-item:hover { transform: none; } }
@media print { .lv-recap { background: none; color: inherit; border: 1px solid #000; box-shadow: none; } }
