/* BOLD — डार्क, बड़े अक्षर, चलती पट्टी */
:root { --fh: 'Teko', 'Mukta', sans-serif; --fb: 'Mukta', sans-serif; --surface: #17171d; --line: rgba(255,255,255,.1); --muted: rgba(255,255,255,.65); --r: 6px; }
body { background: #0E0E12; color: #F4F4F5; }
a { color: var(--a); }
.hd { background: rgba(14,14,18,.85); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.hd-call { background: var(--surface); }
.logo-txt { background: var(--a); color: #0E0E12; }
.hero { padding: 56px 0 0; position: relative; overflow: hidden; background: radial-gradient(ellipse at 80% 0%, color-mix(in srgb, var(--p) 55%, transparent), transparent 60%); }
.kick { color: var(--a); font-weight: 700; letter-spacing: .02em; margin-bottom: 4px; }
.hero h1 { font-size: clamp(3.2rem, 13vw, 7.2rem); line-height: .92; font-weight: 700; max-width: 14ch; color: #fff; }
.hero p { color: var(--muted); font-size: 1.12rem; max-width: 50ch; }
.ctas { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0 46px; }
.btn { border-radius: 4px; }
.btn-a { color: #0E0E12; }
.ticker { background: var(--a); color: #0E0E12; overflow: hidden; white-space: nowrap; padding: 14px 0; transform: rotate(-1.5deg); margin: 0 -10px; }
.tick-in { display: inline-flex; gap: 22px; font: 700 1.6rem/1 var(--fh); animation: tick 18s linear infinite; }
.tick-in i { font-style: normal; opacity: .6; }
@keyframes tick { to { transform: translateX(-50%); } }
.s-stats { padding: 48px 0; }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; text-align: center; }
.stats b { display: block; font: 700 clamp(2.4rem, 9vw, 4rem)/1 var(--fh); color: var(--a); }
.stats span { color: var(--muted); font-size: .9rem; }
.hscroll { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 6px max(16px, calc((100% - 1100px) / 2)) 18px; scrollbar-width: none; }
.hcard { scroll-snap-align: start; flex: none; width: 230px; min-height: 250px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; padding: 20px; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; transition: border-color .2s, transform .2s; }
.hcard:hover { border-color: var(--a); transform: translateY(-4px); }
.h-ic { font-size: 3.4rem; margin-bottom: auto; }
.hcard b { font-size: 1.15rem; }
.hcard .price { color: var(--a); font: 700 1.7rem/1 var(--fh); }
.form input, .form select, .emi input { background: #0E0E12; color: #fff; }
.foot { background: #000; }
.s-pay .pay-box { background: linear-gradient(120deg, var(--p), color-mix(in srgb, var(--p) 40%, #000)); border: 0; }
.s-pay .pay-box p { color: rgba(255,255,255,.8); }
.map { color: #fff; border-color: var(--a); }
.map em { color: var(--a); }
@media (min-width: 900px) { .hero { padding-top: 90px; } }