/* =====================================================================
   NM Jindal Global: premium layer (real photography, cinematic hero,
   marquee, counters). Loaded after site.css.
   ===================================================================== */
.scroll-progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 2000; background: linear-gradient(90deg, var(--gold-dark), var(--gold-light)); box-shadow: 0 0 12px rgba(232, 184, 84, .7); }

/* cinematic hero */
.hero.hero-photo { min-height: 100vh; display: flex; align-items: center; padding: 8.5rem 0 7.5rem; isolation: isolate; }
.hero-photo .hero-img { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; transform-origin: 60% 50%; animation: kenburns 28s ease-in-out infinite alternate; }
@keyframes kenburns { from { transform: scale(1.02); } to { transform: scale(1.14) translate(-1.5%, 1%); } }
.hero-photo::before { content: ""; position: absolute; inset: 0; z-index: -2; background:
  linear-gradient(90deg, rgba(8, 8, 10, .96) 0%, rgba(8, 8, 10, .82) 38%, rgba(8, 8, 10, .35) 72%, rgba(8, 8, 10, .55) 100%),
  linear-gradient(180deg, rgba(8, 8, 10, .7), transparent 30%, transparent 62%, var(--bg)); }
.hero-photo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(50% 60% at 78% 45%, rgba(232, 184, 84, .14), transparent 70%); pointer-events: none; }
.hero-photo h1 { font-size: clamp(2.4rem, 5.4vw, 4.6rem); max-width: 14ch; text-shadow: 0 6px 40px rgba(0, 0, 0, .6); }
.hero-photo .lead-nm { max-width: 36rem; }
.hero-stats { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; }
.glass { background: rgba(14, 14, 17, .62); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); border: 1px solid var(--line-strong); border-radius: var(--radius); }
.hero-stats .glass { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 1.6rem; overflow: hidden; }
.hero-stats .cell { padding: 1.15rem 1.4rem; display: flex; align-items: center; gap: .9rem; border-right: 1px solid var(--line); }
.hero-stats .cell:last-child { border-right: 0; }
.hero-stats .cell i { font-size: 1.6rem; color: var(--gold); }
.hero-stats .cell strong { display: block; font-size: 1.5rem; line-height: 1.1; font-weight: 600; color: #fff; }
.hero-stats .cell span { font-size: .78rem; color: var(--muted); line-height: 1.3; display: block; }
@media (max-width: 991.98px) {
  .hero-stats { position: static; margin-top: 3rem; }
  .hero-stats .glass { grid-template-columns: repeat(2, 1fr); }
  .hero-stats .cell { border-bottom: 1px solid var(--line); }
  .hero.hero-photo { padding-bottom: 4rem; min-height: 0; }
}
.scroll-cue { position: absolute; right: 2rem; bottom: 8.5rem; z-index: 2; writing-mode: vertical-rl; font-size: .7rem; letter-spacing: .3em; text-transform: uppercase; color: var(--muted); display: flex; align-items: center; gap: .8rem; }
.scroll-cue::after { content: ""; width: 1px; height: 54px; background: linear-gradient(var(--gold), transparent); animation: cue 2.2s ease-in-out infinite; }
@keyframes cue { 0% { transform: scaleY(0); transform-origin: top; } 50% { transform: scaleY(1); transform-origin: top; } 51% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
@media (max-width: 1199.98px) { .scroll-cue { display: none; } }

/* marquee */
.marquee { overflow: hidden; border-block: 1px solid var(--line); background: #050506; padding: 1.15rem 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee-track { display: flex; width: max-content; animation: marq 38s linear infinite; }
.marquee:hover .marquee-track { animation-play-state: paused; }
.marquee span { font-size: 1.05rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: #d8d3c7; padding: 0 1.6rem; white-space: nowrap; display: inline-flex; align-items: center; gap: 3.2rem; }
.marquee span::after { content: "\25C6"; color: var(--gold); font-size: .6rem; }
@keyframes marq { to { transform: translateX(-50%); } }

/* page hero with photo */
.page-hero.has-photo { padding: 11rem 0 6rem; isolation: isolate; }
.page-hero.has-photo::before { z-index: -1; background: linear-gradient(180deg, rgba(8, 8, 10, .8), rgba(8, 8, 10, .55) 45%, var(--bg)), radial-gradient(55% 90% at 50% 0%, rgba(232, 184, 84, .18), transparent 70%); -webkit-mask-image: none; mask-image: none; }
.page-hero .ph-img { position: absolute; inset: -6% 0; z-index: -2; width: 100%; height: 112%; object-fit: cover; will-change: transform; }
.page-hero h1 { text-shadow: 0 6px 40px rgba(0, 0, 0, .55); }

/* editorial image stack */
.stack { position: relative; padding: 0 0 3rem 0; max-width: 520px; margin-inline: auto; }
.stack .main { border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line-strong); box-shadow: 0 40px 90px rgba(0, 0, 0, .6); aspect-ratio: 4 / 5; }
.stack .main img, .stack .sub img { width: 100%; height: 100%; object-fit: cover; display: block; }
.stack .sub { position: absolute; right: -9%; bottom: 0; width: 52%; aspect-ratio: 1; border-radius: var(--radius); overflow: hidden; border: 6px solid var(--bg); outline: 1px solid var(--line-strong); box-shadow: 0 26px 60px rgba(0, 0, 0, .65); }
.stack::before { content: ""; position: absolute; left: -22px; top: -22px; width: 55%; height: 55%; border: 1px solid var(--gold-dark); border-radius: var(--radius); z-index: -1; }
.stack .badge-card { position: absolute; left: -6%; bottom: 9%; padding: 1rem 1.3rem; border-radius: 14px; z-index: 3; }
.stack .badge-card strong { display: block; font-size: 1.7rem; line-height: 1; color: var(--gold-light); font-weight: 600; }
.stack .badge-card span { font-size: .78rem; color: #d8d3c7; }
@media (max-width: 575.98px) { .stack .sub { right: -3%; } .stack .badge-card { left: 0; } }

/* photo cards (trade) */
.photo-card { position: relative; display: block; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); min-height: 460px; height: 100%; isolation: isolate; background: #000; transition: transform .5s, border-color .5s, box-shadow .5s; }
.photo-card > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 1.4s cubic-bezier(.2, .7, .2, 1), filter .6s; filter: saturate(.9) brightness(.82); }
.photo-card::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8, 8, 10, .15) 8%, rgba(8, 8, 10, .62) 42%, rgba(8, 8, 10, .96) 82%); }
.photo-card:hover { transform: translateY(-8px); border-color: var(--gold); box-shadow: 0 30px 70px rgba(0, 0, 0, .6), 0 0 60px rgba(232, 184, 84, .12); }
.photo-card:hover > img { transform: scale(1.08); filter: saturate(1) brightness(.95); }
.photo-card .body { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.8rem; }
.photo-card .tag { display: inline-block; font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); margin-bottom: .6rem; }
.photo-card h3 { font-size: 1.6rem; margin-bottom: .5rem; }
.photo-card p { color: #cfcabd; font-size: .93rem; margin-bottom: 1rem; font-weight: 300; }
.photo-card .chip-list { margin-top: 0; }

/* range tiles */
.tile { position: relative; border-radius: 16px; overflow: hidden; aspect-ratio: 4 / 5; border: 1px solid var(--line); isolation: isolate; }
.tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 1.2s cubic-bezier(.2, .7, .2, 1); }
.tile::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(transparent 45%, rgba(0, 0, 0, .88)); }
.tile:hover img { transform: scale(1.08); }
.tile span { position: absolute; left: 1.1rem; bottom: 1rem; font-weight: 500; color: #fff; }
.tile span::before { content: ""; display: block; width: 26px; height: 2px; background: var(--gold); margin-bottom: .55rem; }

/* service cards (photo) */
.service-card .thumb { position: relative; }
.service-card .thumb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 55%, rgba(18, 18, 21, .95)); pointer-events: none; }
.service-card .svc-no { position: absolute; z-index: 2; top: 1rem; left: 1rem; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font-weight: 600; font-size: .9rem; color: #14100a; background: linear-gradient(135deg, var(--gold-light), var(--gold-dark)); box-shadow: 0 6px 20px rgba(0, 0, 0, .5); }
.service-card .body { position: relative; }
.service-card .body::before { content: ""; position: absolute; left: 1.7rem; top: 0; height: 2px; width: 0; background: var(--gold); transition: width .5s; }
.service-card:hover .body::before { width: 56px; }

/* CTA with photo */
.cta.has-photo { position: relative; isolation: isolate; padding: 8rem 0; overflow: hidden; }
.cta.has-photo .cta-img { position: absolute; inset: -8% 0; width: 100%; height: 116%; object-fit: cover; z-index: -2; will-change: transform; }
.cta.has-photo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, var(--bg), rgba(8, 8, 10, .72) 30%, rgba(8, 8, 10, .72) 70%, #050506); }

.img-frame .stamp { position: absolute; right: 1.2rem; bottom: 1.2rem; padding: .7rem 1rem; border-radius: 12px; font-size: .8rem; color: #fff; display: flex; align-items: center; gap: .5rem; z-index: 2; }
.img-frame .stamp i { color: var(--gold); font-size: 1.1rem; }

.freight-card.wide { aspect-ratio: 21 / 8; }
@media (max-width: 767.98px) { .freight-card.wide { aspect-ratio: 3 / 2; } }

/* image reveal */
.js .reveal-img { clip-path: inset(0 0 100% 0); transition: clip-path 1.2s cubic-bezier(.7, 0, .2, 1); }
.js .reveal-img.in { clip-path: inset(0); }
@media (prefers-reduced-motion: reduce) {
  .hero-photo .hero-img, .marquee-track { animation: none !important; }
  .js .reveal-img { clip-path: none; }
}

h1, h2, h3 { text-wrap: balance; }