/* Match callahantrans.com: near-black, cream, Callahan green, Fraunces + Inter */
:root {
  --ground: #17170F; --panel: #1F1F16; --panel-2: #2B2B22; --line: rgba(245,243,236,.10);
  --gold: #3D973D; --teal: #3D973D; --blue: #3D973D; --leaf: #5FB35F; --callahan-green: #3D973D;
  --ink: #F5F3EC; --muted: #D6D4C6; --paper: #F5F3EC;
}
body { background: radial-gradient(70% 40% at 85% -5%, rgba(61,151,61,.14), transparent 70%), var(--ground) !important }
h1, .wall-title, .alerts-title, .step, .lk-1 { font-family: "Fraunces", Georgia, serif !important; font-weight: 600 !important; letter-spacing: -.01em !important }
.lk-1 { letter-spacing: .06em !important }
.hero-photo h1 { background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important; color: var(--ink) !important }
.hero-photo h1 em { font-style: italic; color: #8FD08F }
.company, .lt-kicker, .updated { color: #8FD08F !important }
.cta a.primary { background: #3D973D !important; color: #fff !important; box-shadow: 0 8px 24px rgba(61,151,61,.35) !important }
.cta a.ghost { border-color: rgba(245,243,236,.25) !important }
.sitenav a.nl[aria-current="page"], .cat-tab[aria-selected="true"], .chip, .call a:not(.alt), .alert-btn, .book-btn, .sharebtn, .btn-loaded { background: #3D973D !important; color: #fff !important }
.btn-delivered { background: #F5F3EC !important; color: #17170F !important }
.cal-item { border-top-color: #3D973D !important }
.approve { border-left-color: #3D973D !important }
.lk-text { border-image: linear-gradient(180deg, #3D973D, #F5F3EC) 1 !important }
.lk-2 { color: #8FD08F !important; filter: none !important }
.badge .ring { background: conic-gradient(from 0deg, #3D973D, #F5F3EC, #3D973D 55%, #17170F 70%, #3D973D) !important; filter: drop-shadow(0 0 14px rgba(61,151,61,.5)) !important }
.badge .ring::after { background: #17170F !important }
.fx-night { background: #0c0c08 !important }
.hero-photo { border-color: rgba(61,151,61,.3) !important; box-shadow: 0 0 80px rgba(61,151,61,.12) !important }
.hero-photo::before { background: linear-gradient(90deg, rgba(14,14,9,.88) 0%, rgba(14,14,9,.55) 45%, rgba(14,14,9,0) 75%), linear-gradient(180deg, rgba(14,14,9,0) 60%, rgba(14,14,9,.7) 100%) !important }
@media (max-width: 600px) { .hero-photo::before { background: linear-gradient(180deg, rgba(14,14,9,.1) 0%, rgba(14,14,9,.6) 40%, rgba(14,14,9,.94) 100%) !important } }
.broker-line { font-size: 12px; color: var(--muted); opacity: .8; margin: 0 }
.broker-line a { color: #8FD08F }

/* 2026 logo emblem: glass tile, live green border, flashing headlights, light sweep, 3D tilt */
.badge { display: none }
.emblem { --rx: 0deg; --ry: 0deg; position: relative; width: clamp(150px, 26vw, 230px); aspect-ratio: 1; flex: none;
  transform: perspective(700px) rotateX(var(--rx)) rotateY(var(--ry)); transition: transform .25s ease-out; transform-style: preserve-3d }
.em-border { position: absolute; inset: -3px; border-radius: 34px; overflow: hidden; filter: drop-shadow(0 0 22px rgba(61,151,61,.55)) }
.em-border::before { content: ""; position: absolute; inset: -50%;
  background: conic-gradient(from 0deg, #3D973D, #9BE39B, #F5F3EC, #3D973D 40%, #17170F 60%, #3D973D 80%, #9BE39B, #3D973D);
  animation: spin 5s linear infinite }
.em-tile { position: absolute; inset: 0; border-radius: 31px; overflow: hidden; display: grid; place-items: center;
  background: radial-gradient(120% 90% at 50% 15%, #FFFFFF 0%, #F5F3EC 55%, #D6D4C6 100%);
  box-shadow: inset 0 2px 0 rgba(255,255,255,.9), inset 0 -18px 30px rgba(23,23,15,.18), 0 30px 60px -20px rgba(0,0,0,.8);
  animation: emglow 3.2s ease-in-out infinite }
.em-grid { position: absolute; inset: 0; opacity: .35;
  background-image: linear-gradient(rgba(61,151,61,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(61,151,61,.18) 1px, transparent 1px);
  background-size: 16px 16px; -webkit-mask: radial-gradient(circle at 50% 40%, #000, transparent 70%); mask: radial-gradient(circle at 50% 40%, #000, transparent 70%) }
.em-tile img { position: relative; width: 100%; height: auto; transform: translateZ(30px) translateY(4%); filter: drop-shadow(0 10px 10px rgba(23,23,15,.35));
  animation: truckbob 2.4s ease-in-out infinite }
/* headlight positions match the truck art (~35% / 65% across, ~52% down the art) */
.hl { position: absolute; top: 51%; width: 22%; aspect-ratio: 1; margin: -11% 0 0 -11%; border-radius: 50%; mix-blend-mode: screen;
  background: radial-gradient(circle, #fff 0 12%, rgba(255,250,215,.95) 22%, rgba(155,227,155,.45) 45%, transparent 70%);
  opacity: 0; animation: flash 4s ease-in-out infinite }
.hl.l { left: 36% } .hl.r { left: 64%; animation-delay: .06s }
.em-sheen { position: absolute; top: -40%; bottom: -40%; width: 30%; left: -60%; transform: skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.75), transparent); animation: sheen 4s ease-in-out infinite }
.em-beam { position: absolute; left: 50%; top: 92%; width: 160%; height: 70%; transform: translateX(-50%); pointer-events: none; z-index: -1;
  background: radial-gradient(50% 60% at 50% 0%, rgba(245,243,236,.30), rgba(61,151,61,.14) 45%, transparent 75%);
  filter: blur(6px); animation: beam 4s ease-in-out infinite }
@keyframes flash { 0%, 62%, 100% { opacity: 0; transform: scale(.6) } 68% { opacity: 1; transform: scale(1.25) } 72% { opacity: .25 } 76% { opacity: 1; transform: scale(1.1) } 86% { opacity: 0 } }
@keyframes beam { 0%, 62%, 100% { opacity: .45 } 68%, 78% { opacity: 1 } }
@keyframes emglow { 0%, 100% { box-shadow: inset 0 2px 0 rgba(255,255,255,.9), inset 0 -18px 30px rgba(23,23,15,.18), 0 30px 60px -20px rgba(0,0,0,.8), 0 0 0 rgba(61,151,61,0) }
  50% { box-shadow: inset 0 2px 0 rgba(255,255,255,.9), inset 0 -18px 30px rgba(23,23,15,.18), 0 30px 60px -20px rgba(0,0,0,.8), 0 0 46px rgba(61,151,61,.55) } }
.lockup { gap: clamp(16px, 3vw, 28px) !important; align-items: center }
.lk-1 { font-size: clamp(30px, 5.4vw, 54px) !important; letter-spacing: .08em !important;
  background: linear-gradient(100deg, #F5F3EC 0%, #F5F3EC 40%, #9BE39B 50%, #F5F3EC 60%, #F5F3EC 100%); background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent !important; animation: wordshine 6s ease-in-out infinite }
@keyframes wordshine { 0%, 55% { background-position: 100% 0 } 100% { background-position: -50% 0 } }
@media (max-width: 480px) { .emblem { width: 108px } .lk-1 { font-size: 27px !important; letter-spacing: .04em !important } .lk-2 { font-size: 9px !important; letter-spacing: .14em !important } .em-border { border-radius: 28px } .em-tile { border-radius: 25px } }
@media (prefers-reduced-motion: reduce) { .emblem { transform: none } .em-border::before, .em-tile, .em-tile img, .hl, .em-sheen, .em-beam, .lk-1 { animation: none } }
