/* DA Motors — brand design system layered on top of Tailwind CDN
   Brand: green (#57B947) + blue (#2E3192) on white, per the DA logo. */

:root {
  --brand-green: #57B947;
  --brand-greendark: #3E8E2F;
  --brand-blue: #2E3192;
  --brand-dark: #14152E;
}

/* Velocity headlines — condensed, automotive */
h1, h2 { font-family: 'Saira Condensed', 'Sora', sans-serif; letter-spacing: .004em; }
h3, h4 { font-family: 'Sora', 'Inter', sans-serif; }
.font-head { font-family: 'Saira Condensed', 'Sora', sans-serif; }

/* Marquee ticker */
.marquee { overflow: hidden; }
.marquee__track { display: inline-flex; align-items: center; white-space: nowrap; will-change: transform; animation: marquee 30s linear infinite; }
.marquee:hover .marquee__track { animation-play-state: paused; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* Angled section cuts (the logo-swoosh energy) */
.slant-b  { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 3.5vw), 0 100%); }
.slant-t  { clip-path: polygon(0 3.5vw, 100% 0, 100% 100%, 0 100%); }
.slant-tb { clip-path: polygon(0 3.5vw, 100% 0, 100% calc(100% - 3.5vw), 0 100%); }

/* Speed arc accent */
.arc-spin { animation: arcfloat 9s ease-in-out infinite alternate; transform-origin: center; }
@keyframes arcfloat { from { transform: rotate(-3deg) translateY(0); } to { transform: rotate(2deg) translateY(-10px); } }

/* ---- Enterprise polish -------------------------------------------------- */
/* Eyebrow label with lead line */
.eyebrow { display:inline-flex; align-items:center; gap:.7rem; text-transform:uppercase; letter-spacing:.2em; font-weight:600; font-size:.72rem; }
.eyebrow::before { content:''; width:1.7rem; height:2px; background:currentColor; border-radius:2px; opacity:.85; }

/* Gradient accent text (green -> bright blue, pops on dark) */
.gradient-text { background:linear-gradient(100deg,#6FE05A 0%,#46A6FF 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }

/* Subtle film grain + aurora glows for premium depth */
.noise { position:absolute; inset:0; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.aurora { position:absolute; border-radius:9999px; filter:blur(90px); opacity:.45; pointer-events:none; }

/* Card with animated gradient top-accent */
.feature-card { position:relative; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.feature-card::after { content:''; position:absolute; left:1.25rem; right:1.25rem; top:0; height:3px; border-radius:0 0 3px 3px;
  background:linear-gradient(90deg,#57B947,#2E3192); transform:scaleX(0); transform-origin:left; transition:transform .35s ease; }
.feature-card:hover::after { transform:scaleX(1); }
.feature-card:hover { transform: translateY(-4px); box-shadow: 0 24px 50px -28px rgba(20,21,46,.5); border-color: rgba(87,185,71,.35); }

/* Gradient hairline border wrapper */
.grad-border { position:relative; border-radius:1.25rem; background:linear-gradient(135deg, rgba(87,185,71,.5), rgba(46,49,146,.5)); padding:1px; }
.grad-border > * { border-radius:calc(1.25rem - 1px); }

/* Hero carousel */
.carousel__slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .8s ease; }
.carousel__slide.is-active { position: relative; opacity: 1; visibility: visible; }
.carousel__dots button { width: 10px; height: 10px; border-radius: 9999px; background: rgba(255,255,255,.45); transition: all .3s ease; }
.carousel__dots button.is-active { background: #57B947; width: 30px; }

/* Scroll progress bar */
#scroll-progress { position:fixed; top:0; left:0; height:3px; width:0; z-index:60;
  background:linear-gradient(90deg,#57B947,#46A6FF,#2E3192); box-shadow:0 0 12px rgba(87,185,71,.5); }

/* Cursor-follow spotlight on cards */
.spotlight::before { content:''; position:absolute; inset:0; border-radius:inherit; opacity:0; pointer-events:none;
  transition:opacity .35s ease; z-index:0;
  background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%), rgba(87,185,71,.16), transparent 62%); }
.spotlight:hover::before { opacity:1; }
.spotlight > * { position:relative; z-index:1; }

/* Hero entrance + drifting aurora */
@keyframes rise { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:none; } }
.rise { opacity:0; animation: rise .75s cubic-bezier(.2,.7,.2,1) forwards; }
@keyframes drift { from { transform:translate3d(0,0,0) scale(1); } to { transform:translate3d(24px,-18px,0) scale(1.08); } }
.aurora { animation: drift 14s ease-in-out infinite alternate; }
@media (prefers-reduced-motion: reduce) { .rise{animation:none;opacity:1} .aurora{animation:none} .arc-spin{animation:none} .marquee__track{animation:none} }

/* Buttons */
.btn-primary {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  background: linear-gradient(180deg, #5FBE4D 0%, #3E8E2F 100%); color: #fff; font-weight: 600;
  padding: .72rem 1.5rem; border-radius: .7rem; line-height: 1;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 10px 26px -10px rgba(87,185,71,.7);
  transition: transform .15s ease, box-shadow .25s ease, filter .2s ease;
}
.btn-primary:hover { filter: brightness(1.05); transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 18px 36px -12px rgba(87,185,71,.85); }

/* Blue accent button (the logo's secondary colour) */
.btn-blue {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  background: var(--brand-blue); color: #fff; font-weight: 600;
  padding: .7rem 1.4rem; border-radius: .65rem; line-height: 1;
  transition: transform .15s ease, filter .2s ease;
}
.btn-blue:hover { filter: brightness(1.1); transform: translateY(-1px); }

.btn-outline {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  border: 1.5px solid rgba(20,21,46,.18); color: var(--brand-dark); font-weight: 600;
  padding: .65rem 1.35rem; border-radius: .65rem; line-height: 1;
  transition: border-color .2s ease, color .2s ease;
}
.btn-outline:hover { border-color: var(--brand-green); color: var(--brand-green); }

.btn-white {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  background: #fff; color: var(--brand-dark); font-weight: 600;
  padding: .7rem 1.4rem; border-radius: .65rem; line-height: 1;
  transition: transform .15s ease;
}
.btn-white:hover { transform: translateY(-1px); }

/* Nav underline */
.nav-link { position: relative; padding-bottom: 2px; }
.nav-link::after {
  content: ''; position: absolute; left: 0; bottom: -4px; height: 2px; width: 0;
  background: var(--brand-green); transition: width .25s ease;
}
.nav-link:hover::after { width: 100%; }

#nav.scrolled { box-shadow: 0 6px 24px -12px rgba(0,0,0,.25); }

/* Hero gradient + pattern — deep brand-blue navy with a green glow */
.hero-bg {
  background:
    radial-gradient(1200px 500px at 80% -10%, rgba(87,185,71,.22), transparent 60%),
    linear-gradient(135deg, #14152E 0%, #1b1d4d 55%, #2E3192 100%);
}
.hero-grid {
  background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 44px 44px;
}

/* Reveal on scroll */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in { opacity: 1; transform: none; }

/* Cards */
.card-hover { transition: transform .2s ease, box-shadow .2s ease; }
.card-hover:hover { transform: translateY(-4px); box-shadow: 0 22px 40px -22px rgba(0,0,0,.35); }

/* FAQ accordion */
.faq-item .faq-body { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
.faq-item.open .faq-body { max-height: 600px; }
.faq-item.open .faq-icon { transform: rotate(45deg); }
.faq-icon { transition: transform .25s ease; }

/* Prose for news bodies */
.prose-da { line-height: 1.75; }
.prose-da p { margin: 0 0 1rem; }
.prose-da h2 { font-size: 1.5rem; font-weight: 700; margin: 1.6rem 0 .6rem; }
.prose-da h3 { font-size: 1.2rem; font-weight: 700; margin: 1.3rem 0 .5rem; }
.prose-da ul { list-style: disc; padding-left: 1.3rem; margin: 0 0 1rem; }
.prose-da a { color: var(--brand-green); text-decoration: underline; }

/* ---- Glassmorphism ------------------------------------------------------ */
.glass {
  background: rgba(255,255,255,.55);
  -webkit-backdrop-filter: blur(16px) saturate(160%);
  backdrop-filter: blur(16px) saturate(160%);
  border: 1px solid rgba(255,255,255,.6);
  box-shadow: 0 10px 30px -18px rgba(20,21,46,.35);
}
.glass-dark {
  background: rgba(20,21,46,.42);
  -webkit-backdrop-filter: blur(14px) saturate(150%);
  backdrop-filter: blur(14px) saturate(150%);
  border: 1px solid rgba(255,255,255,.14);
}
.glass-nav {
  background: rgba(255,255,255,.72);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  backdrop-filter: blur(14px) saturate(160%);
}
/* photo backdrop helper for full-bleed sections */
.photo-cover { background-size: cover; background-position: center; }
.tint-section { background: linear-gradient(180deg, #F2F7EE 0%, #ffffff 100%); }

/* Leaflet popup tweak */
.leaflet-popup-content { font-family: 'Inter', sans-serif; }