/* ===== V27 ===== */

/* One header size everywhere: home now matches the interior pages. */
header img.v26-logo{max-width:170px;object-fit:contain;height:80px!important;width:auto!important}

/* Interior page heroes (Services, About, Contact, Financing): photo lowered so heads clear the nav,
   top edge blends into the header, ~5% brighter. */
.v27-hero-img{
  object-position:center 0% !important;
  opacity:.42 !important;
  filter:brightness(1.05);
  transform:translateY(clamp(70px,calc(250px - 6vw),170px));
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 110px);
          mask-image:linear-gradient(to bottom,transparent 0,#000 110px);
}
@media (max-width:767px){ .v27-hero-img{transform:translateY(80px);object-position:68% 0% !important} }

/* Financing hero: blue wash stays on the text side and below the nav; the people stay clear. */
.v27-fin-img{opacity:.5 !important}
.v27-fin-wash{background:
   linear-gradient(to bottom,#070b15 0,rgba(7,11,21,.85) 110px,rgba(7,11,21,0) 230px),
   linear-gradient(90deg,rgba(9,33,77,.96) 0%,rgba(12,52,112,.82) 34%,rgba(12,52,112,.35) 52%,rgba(12,52,112,0) 64%) !important}
@media (max-width:767px){ .v27-fin-wash{background:
   linear-gradient(to bottom,#070b15 0,rgba(7,11,21,.6) 140px,rgba(9,33,77,.85) 60%,rgba(9,33,77,.95) 100%) !important} }
.v27-fin-bottom{position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(to bottom,rgba(10,15,28,0),#0a0f1c);pointer-events:none}
.v27-fin-chips{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px}
.v27-fin-chips span{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:#e0f2fe;background:rgba(7,11,21,.45);border:1px solid rgba(125,211,252,.3);border-radius:999px;padding:8px 14px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.v27-fin-chips span::before{content:"";width:6px;height:6px;border-radius:50%;background:#7dd3fc}

/* Home hero: header is now the same (taller) size as interior pages, so drop the photo a bit more. */
.v26-hero-img{transform:translateY(clamp(100px,18vh,190px)) !important}
@media (max-width:767px){ .v26-hero-img{transform:translateY(90px) !important} }
