/* Forklift Rentals DFW -- marketing site styles. Uses tokens from
   colors_and_type.css. Multi-page static site; chrome injected by site.js. */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--white); color: var(--fg-2); font-family: var(--font-body); }
img { max-width: 100%; display: block; }
button { font-family: inherit; }
.container { max-width: var(--container-max); margin: 0 auto; padding-inline: 24px; width: 100%; }
.lic { display:inline-flex; align-items:center; justify-content:center; flex:none; }
.lic svg { width:100%; height:100%; display:block; }

/* ---------- Buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; cursor:pointer;
  font-weight:600; font-size:15px; line-height:1; border:1.5px solid transparent; text-decoration:none;
  border-radius: var(--radius-md); padding:12px 22px; transition: var(--transition); white-space:nowrap; }
.btn:focus-visible { outline:none; box-shadow: var(--focus-ring); }
.btn .lic { width:18px; height:18px; }
.btn-primary { background: var(--navy-900); color:#fff; }
.btn-primary:hover { background: var(--navy-800); }
.btn-accent { background: var(--orange-500); color:#fff; }
.btn-accent:hover { background: var(--orange-600); }
.btn-outline { background:transparent; color: var(--navy-900); border-color: var(--gray-300); }
.btn-outline:hover { background: var(--gray-50); border-color: var(--navy-900); }
.btn-light { background:#fff; color: var(--navy-900); }
.btn-light:hover { background: var(--gray-100); }
.btn-on-dark { background:transparent; color:#fff; border-color: rgba(255,255,255,.4); }
.btn-on-dark:hover { background: rgba(255,255,255,.12); }
.btn-lg { padding:15px 30px; font-size:16px; }
.btn-block { width:100%; }

.eyebrow { font-family: var(--font-display); font-weight:600; font-size:14px; text-transform:uppercase;
  letter-spacing: var(--tracking-wider); color: var(--orange-500); margin:0 0 10px; }
.eyebrow.on-dark { color: var(--sky-400); }

/* ---------- Top utility bar ---------- */
.topbar { background: var(--navy-950); color: var(--fg-on-dark-2); font-size:13.5px; }
.topbar .inner { display:flex; align-items:center; justify-content:space-between; padding-block:8px; gap:16px; flex-wrap:wrap; }
.topbar .left { display:flex; align-items:center; gap:8px; }
.topbar .right { display:flex; align-items:center; gap:20px; }
.topbar a { color:#fff; text-decoration:none; display:flex; align-items:center; gap:7px; font-weight:600; }
.topbar a:hover { color: var(--sky-400); }
.topbar .lic { width:15px; height:15px; color: var(--sky-400); }

/* ---------- Header / nav ---------- */
.hdr { position: sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid var(--gray-200); box-shadow: var(--shadow-xs); }
.hdr .inner { display:flex; align-items:center; gap:24px; padding-block:14px; }
.hdr-logo { display:flex; align-items:center; flex:none; }
.hdr-logo img { height:58px; width:auto; }
.nav { display:flex; align-items:center; gap:4px; margin-left:auto; }
.nav a { display:block; padding:10px 13px; color: var(--navy-900); font-weight:600; font-size:14.5px; text-decoration:none; border-radius: var(--radius-sm); white-space:nowrap; }
.nav a:hover { background: var(--gray-100); }
.nav a.active { color: var(--orange-500); }
.hdr-cta { display:flex; align-items:center; gap:12px; flex:none; }
.hdr-phone { display:flex; align-items:center; gap:8px; color: var(--navy-900); font-weight:700; font-family: var(--font-display); font-size:18px; text-decoration:none; white-space:nowrap; }
.hdr-phone .lic { width:18px; height:18px; color: var(--orange-500); }
.menu-toggle { display:none; background:none; border:none; cursor:pointer; color: var(--navy-900); }
.menu-toggle .lic { width:28px; height:28px; }

/* mobile menu */
.mnav { display:none; }
@media (max-width: 1140px) {
  .nav, .hdr-phone { display:none; }
  .menu-toggle { display:flex; }
  .mnav { display:block; position:fixed; inset:0 0 0 auto; width:300px; background:#fff; z-index:60;
    box-shadow: var(--shadow-lg); transform: translateX(100%); transition: transform var(--transition); padding:20px; overflow:auto; }
  .mnav.open { transform: translateX(0); }
  .mnav a { display:block; padding:13px 8px; color: var(--navy-900); font-weight:600; border-bottom:1px solid var(--gray-100); text-decoration:none; }
  .mnav a.active { color: var(--orange-500); }
  .mnav .close { display:flex; justify-content:flex-end; margin-bottom:8px; background:none; border:none; cursor:pointer; color: var(--navy-900); }
  .mnav .close .lic { width:26px; height:26px; }
  .mnav-backdrop { display:none; position:fixed; inset:0; background: rgba(7,24,43,.45); z-index:55; }
  .mnav-backdrop.open { display:block; }
}

/* ---------- Generic section ---------- */
.section { padding-block:72px; }
.section.tight { padding-block:52px; }
.section.alt { background: var(--gray-50); }
.section.navy { background: var(--navy-950); color: var(--fg-on-dark-2); }
.section.navy h2, .section.navy h3 { color:#fff; }
.sec-head { max-width:680px; margin-bottom:40px; }
.sec-head.center { margin-inline:auto; text-align:center; }
.sec-head h2 { margin:0; }
.sec-head p { margin:12px 0 0; font-size:17px; }

/* ---------- Hero ---------- */
.hero { position:relative; background: var(--navy-950); color:#fff; overflow:hidden; }
.hero::after { content:''; position:absolute; inset:0; background:
  radial-gradient(1100px 500px at 75% -10%, rgba(95,180,244,.18), transparent 60%); pointer-events:none; }
.hero .inner { position:relative; z-index:1; display:grid; grid-template-columns: 1.05fr .95fr; gap:48px; align-items:center; padding-block:84px; }
.hero h1 { font-family: var(--font-display); font-weight:700; text-transform:uppercase; letter-spacing:-0.01em;
  font-size:62px; line-height:1.02; color:#fff; margin:0; }
.hero h1 .accent { color: var(--orange-500); }
.hero p { color: var(--fg-on-dark-2); font-size:19px; line-height:1.6; margin:20px 0 0; max-width:520px; }
.hero-cta { display:flex; gap:14px; margin-top:30px; flex-wrap:wrap; }
.hero-stats { display:flex; gap:30px; margin-top:38px; flex-wrap:wrap; }
.hero-stats .s b { font-family: var(--font-display); font-size:34px; color:#fff; display:block; line-height:1; }
.hero-stats .s span { font-size:13px; color: var(--fg-on-dark-2); }
.media-panel { position:relative; border-radius: var(--radius-lg); overflow:hidden; height:420px;
  background: linear-gradient(160deg, var(--navy-800), var(--navy-700)); border:1px solid rgba(255,255,255,.12);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; color: var(--fg-on-dark-2); text-align:center; padding:24px; }
.media-panel .lic { width:64px; height:64px; color: var(--sky-400); }
.media-panel .ptitle { font-family: var(--font-display); font-weight:700; font-size:18px; color:#fff; text-transform:uppercase; letter-spacing:.04em; }
.media-panel .psub { font-size:13px; margin-top:4px; max-width:320px; }
.media-panel.play .lic { width:72px; height:72px; }
.float-badge { position:absolute; bottom:22px; left:-14px; background:#fff; color: var(--navy-900); border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg); padding:14px 18px; display:flex; align-items:center; gap:12px; }
.float-badge .lic { width:30px; height:30px; color: var(--orange-500); }
.float-badge b { font-family: var(--font-display); font-size:19px; display:block; line-height:1.1; }
.float-badge span { font-size:12px; color: var(--fg-3); }

/* ---------- Brand / logo strip ---------- */
.brandstrip { border-block:1px solid var(--gray-200); background:#fff; }
.brandstrip .inner { padding-block:26px; }
.brandstrip .lab { text-align:center; font-size:13px; font-weight:600; color: var(--fg-3); text-transform:uppercase; letter-spacing:.08em; margin-bottom:18px; }
.brandstrip .logos { display:flex; align-items:center; justify-content:center; gap:48px; flex-wrap:wrap; }
.brandstrip .logos span { font-family: var(--font-display); font-weight:700; font-size:24px; color: var(--gray-400); letter-spacing:.02em; }

/* ---------- Inventory / product cards ---------- */
.prod-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap:24px; }
.prod-grid.four { grid-template-columns: repeat(4, 1fr); }
.prod-card { background:#fff; border:1px solid var(--gray-200); border-radius: var(--radius-md); overflow:hidden;
  box-shadow: var(--shadow-sm); transition: var(--transition); display:flex; flex-direction:column; text-decoration:none; }
.prod-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.prod-thumb { height:200px; display:flex; align-items:center; justify-content:center; background: var(--gray-50); border-bottom:1px solid var(--gray-100); position:relative; }
.prod-thumb .lic { width:96px; height:96px; color: var(--gray-300); }
.prod-thumb .photo-tag { position:absolute; bottom:8px; right:10px; font-size:10px; color: var(--gray-400); font-family:var(--font-mono); }
.prod-thumb .cond { position:absolute; top:10px; left:10px; }
.prod-body { padding:16px 18px 18px; flex:1; display:flex; flex-direction:column; }
.prod-body .pname { font-family: var(--font-display); font-weight:700; font-size:20px; color: var(--navy-900); }
.prod-body .pmeta { font-size:13px; color: var(--fg-3); margin-top:3px; }
.prod-body .pfoot { margin-top:auto; padding-top:14px; display:flex; align-items:center; justify-content:space-between; }
.prod-body .pprice { font-family: var(--font-display); font-weight:700; font-size:22px; color: var(--navy-900); font-variant-numeric:tabular-nums; }
.prod-body .pprice small { font-size:12px; color: var(--fg-3); font-weight:500; font-family:var(--font-body); }
.prod-body .go { color: var(--orange-500); font-weight:600; font-size:14px; display:flex; align-items:center; gap:5px; }
.prod-body .go .lic { width:15px; height:15px; }

/* ---------- Badges ---------- */
.badge { display:inline-flex; align-items:center; gap:6px; font-weight:600; font-size:12px; padding:4px 11px; border-radius: var(--radius-pill); white-space:nowrap; }
.badge-new { background: var(--success-bg); color: var(--success); }
.badge-used { background: var(--sky-100); color: var(--sky-600); }
.badge-rent { background: var(--orange-100); color: var(--orange-600); }

/* ---------- Category tiles ---------- */
.cat-tiles { display:grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.cat-tile { position:relative; border-radius: var(--radius-lg); overflow:hidden; min-height:230px; padding:26px;
  display:flex; flex-direction:column; justify-content:flex-end; color:#fff; text-decoration:none;
  background: linear-gradient(180deg, rgba(7,24,43,.15), rgba(7,24,43,.85)), var(--navy-700); border:1px solid var(--gray-200); }
.cat-tile .lic.bg { position:absolute; top:20px; right:20px; width:64px; height:64px; color: rgba(255,255,255,.22); }
.cat-tile h3 { color:#fff; margin:0; font-size:24px; }
.cat-tile span { display:flex; align-items:center; gap:6px; color:#fff; font-weight:600; font-size:14px; margin-top:8px; opacity:.9; }
.cat-tile span .lic { width:15px; height:15px; }
.cat-tile:hover { box-shadow: var(--shadow-lg); }

/* ---------- Feature trio / value cards ---------- */
.trio { display:grid; grid-template-columns: repeat(3,1fr); gap:28px; }
.feature { text-align:center; padding:8px; }
.feature .ic-wrap { width:64px; height:64px; border-radius: var(--radius-lg); background: var(--sky-100); margin:0 auto 16px;
  display:flex; align-items:center; justify-content:center; }
.feature .ic-wrap .lic { width:30px; height:30px; color: var(--navy-900); }
.feature h3 { margin:0 0 6px; font-size:21px; }
.feature p { margin:0; font-size:14.5px; color: var(--fg-3); }

.valuecards { display:grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.valuecard { background:#fff; border:1px solid var(--gray-200); border-radius: var(--radius-md); overflow:hidden; box-shadow: var(--shadow-sm); }
.valuecard .img { height:170px; background: var(--gray-100); display:flex; align-items:center; justify-content:center; }
.valuecard .img .lic { width:54px; height:54px; color: var(--gray-300); }
.valuecard .body { padding:20px 22px 24px; }
.valuecard h3 { margin:0 0 8px; font-size:21px; }
.valuecard p { margin:0; font-size:14.5px; color: var(--fg-2); }

/* ---------- Split / about block ---------- */
.split { display:grid; grid-template-columns: 1fr 1fr; gap:48px; align-items:center; }
.split.media-right .media-panel, .split .media-panel { height:380px; }
.split ul.checks { list-style:none; padding:0; margin:20px 0 0; display:flex; flex-direction:column; gap:12px; }
.split ul.checks li { display:flex; gap:11px; align-items:flex-start; font-size:15.5px; color: var(--fg-2); }
.split ul.checks .lic { width:22px; height:22px; color: var(--success); flex:none; margin-top:1px; }

/* ---------- Testimonials ---------- */
.testi-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.testi { background:#fff; border:1px solid var(--gray-200); border-radius: var(--radius-md); padding:24px; box-shadow: var(--shadow-sm); display:flex; flex-direction:column; }
.testi .stars { display:flex; gap:3px; color: var(--orange-500); margin-bottom:14px; }
.testi .stars .lic { width:18px; height:18px; }
.testi p { font-size:15px; line-height:1.6; color: var(--fg-2); margin:0 0 18px; }
.testi .who { display:flex; align-items:center; gap:12px; margin-top:auto; }
.testi .avatar { width:44px; height:44px; border-radius:50%; background: var(--navy-900); color:#fff; display:flex; align-items:center; justify-content:center; font-family: var(--font-display); font-weight:700; font-size:17px; flex:none; }
.testi .who b { display:block; color: var(--navy-900); font-size:15px; }
.testi .who span { font-size:13px; color: var(--fg-3); }

/* ---------- CTA band ---------- */
.ctaband { background: var(--orange-500); color:#fff; }
.ctaband .inner { display:flex; align-items:center; justify-content:space-between; gap:28px; padding-block:48px; flex-wrap:wrap; }
.ctaband h2 { color:#fff; margin:0; font-size:36px; max-width:640px; }
.ctaband p { color: rgba(255,255,255,.92); margin:8px 0 0; font-size:17px; }
.ctaband .btn-primary { background: var(--navy-950); }
.ctaband .btn-primary:hover { background:#000; }

/* ---------- Service area cards ---------- */
.area-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:22px; }
.area-card { background:#fff; border:1px solid var(--gray-200); border-radius: var(--radius-md); overflow:hidden; box-shadow: var(--shadow-sm); text-decoration:none; transition: var(--transition); }
.area-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.area-card .img { height:150px; background: var(--gray-100); display:flex; align-items:center; justify-content:center; }
.area-card .img .lic { width:44px; height:44px; color: var(--gray-300); }
.area-card .body { padding:16px 18px; display:flex; align-items:center; justify-content:space-between; }
.area-card h3 { margin:0; font-size:19px; }
.area-card .lic.arr { width:18px; height:18px; color: var(--orange-500); }

/* ---------- Page header (interior pages) ---------- */
.pagehead { background: var(--navy-950); color:#fff; position:relative; overflow:hidden; }
.pagehead::after { content:''; position:absolute; inset:0; background: radial-gradient(900px 400px at 80% -20%, rgba(95,180,244,.16), transparent 60%); }
.pagehead .inner { position:relative; z-index:1; padding-block:56px; }
.pagehead .crumb { color: var(--fg-on-dark-2); font-size:13px; margin-bottom:14px; display:flex; gap:8px; align-items:center; }
.pagehead .crumb a { color: var(--sky-400); text-decoration:none; }
.pagehead .crumb .lic { width:13px; height:13px; color: rgba(255,255,255,.35); }
.pagehead h1 { font-family: var(--font-display); text-transform:uppercase; font-size:46px; color:#fff; margin:0; letter-spacing:-0.01em; }
.pagehead p { color: var(--fg-on-dark-2); font-size:17px; margin:14px 0 0; max-width:620px; }

/* ---------- Forms ---------- */
.form-card { background:#fff; border:1px solid var(--gray-200); border-radius: var(--radius-lg); padding:32px; box-shadow: var(--shadow-sm); }
.form-grid { display:grid; grid-template-columns: 1fr 1fr; gap:18px; }
.field { display:flex; flex-direction:column; gap:6px; margin-bottom:4px; }
.field.full { grid-column: 1 / -1; }
.field label { font-weight:600; font-size:13.5px; color: var(--fg-1); }
.field .req { color: var(--danger); }
.field input, .field select, .field textarea { font-family: var(--font-body); font-size:15px; padding:11px 13px;
  border:1px solid var(--gray-300); border-radius: var(--radius-md); color: var(--fg-1); background:#fff; width:100%; }
.field input:focus, .field select:focus, .field textarea:focus { outline:none; border-color: var(--sky-500); box-shadow: var(--focus-ring); }
.field select { appearance:none; background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" stroke="%2364748B" stroke-width="2"><path d="M4 6l4 4 4-4"/></svg>') no-repeat right 12px center; cursor:pointer; }

/* ---------- FAQ accordion / tabs ---------- */
.faq { border:1px solid var(--gray-200); border-radius: var(--radius-md); overflow:hidden; background:#fff; }
.faq-item { border-bottom:1px solid var(--gray-100); }
.faq-item:last-child { border-bottom:none; }
.faq-q { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 22px; cursor:pointer; font-family: var(--font-display); font-weight:600; font-size:18px; color: var(--navy-900); }
.faq-q .lic { width:20px; height:20px; color: var(--orange-500); transition: transform var(--transition); flex:none; }
.faq-item.open .faq-q .lic { transform: rotate(45deg); }
.faq-a { max-height:0; overflow:hidden; transition: max-height var(--transition); }
.faq-a .inner-a { padding:0 22px 20px; font-size:15px; color: var(--fg-2); line-height:1.6; }
.faq-item.open .faq-a { max-height:320px; }

/* ---------- Blog ---------- */
.blog-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:26px; }
.blog-card { background:#fff; border:1px solid var(--gray-200); border-radius: var(--radius-md); overflow:hidden; box-shadow: var(--shadow-sm); text-decoration:none; transition: var(--transition); display:flex; flex-direction:column; }
.blog-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.blog-card .img { height:180px; background: var(--gray-100); display:flex; align-items:center; justify-content:center; }
.blog-card .img .lic { width:44px; height:44px; color: var(--gray-300); }
.blog-card .body { padding:18px 20px 22px; flex:1; display:flex; flex-direction:column; }
.blog-card .cat { font-family: var(--font-display); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:.06em; color: var(--orange-500); margin-bottom:8px; }
.blog-card h3 { margin:0 0 8px; font-size:20px; line-height:1.2; }
.blog-card p { margin:0; font-size:14px; color: var(--fg-3); line-height:1.5; }
.blog-card .meta { margin-top:auto; padding-top:14px; font-size:13px; color: var(--fg-3); }

/* article */
.article { max-width:760px; margin:0 auto; }
.article p { font-size:17px; line-height:1.75; color: var(--fg-2); margin:0 0 20px; }
.article h2 { margin:36px 0 14px; }
.article h3 { margin:28px 0 10px; }
.article ul { margin:0 0 20px; padding-left:22px; }
.article ul li { font-size:17px; line-height:1.7; color: var(--fg-2); margin-bottom:8px; }
.article blockquote { border-left:4px solid var(--orange-500); margin:24px 0; padding:6px 0 6px 22px; font-size:19px; color: var(--navy-900); font-style:italic; }

/* ---------- Footer ---------- */
.ftr { background: var(--navy-950); color: var(--fg-on-dark-2); }
.ftr-main { display:grid; grid-template-columns: 1.5fr 1fr 1fr 1.3fr; gap:36px; padding-block:56px 40px; }
.ftr-logo img { height:84px; width:auto; margin-bottom:16px; }
.ftr-blurb { font-size:14px; line-height:1.65; max-width:300px; }
.ftr-social { display:flex; gap:10px; margin-top:16px; }
.ftr-social a { width:36px; height:36px; border-radius:50%; background: rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center; color:#fff; }
.ftr-social a:hover { background: var(--orange-500); }
.ftr-social .lic { width:18px; height:18px; }
.ftr-col h4 { font-family: var(--font-display); color:#fff; font-size:16px; text-transform:uppercase; letter-spacing:.04em; margin:0 0 14px; }
.ftr-col a { display:block; color: var(--fg-on-dark-2); font-size:14px; padding:5px 0; text-decoration:none; }
.ftr-col a:hover { color:#fff; }
.ftr-contact .row { display:flex; align-items:flex-start; gap:10px; font-size:14px; padding:5px 0; }
.ftr-contact .lic { width:16px; height:16px; color: var(--sky-400); flex:none; margin-top:3px; }
.ftr-contact .phone { font-family: var(--font-display); font-size:22px; color:#fff; font-weight:700; text-decoration:none; }
.ftr-map { height:150px; border-radius: var(--radius-md); overflow:hidden; margin-top:14px; border:1px solid rgba(255,255,255,.12); background: var(--navy-800); display:flex; align-items:center; justify-content:center; color: var(--fg-on-dark-2); font-size:13px; gap:8px; }
.ftr-map .lic { width:20px; height:20px; color: var(--sky-400); }
.ftr-bottom { border-top:1px solid rgba(255,255,255,.1); padding-block:18px; font-size:13px; }
.ftr-bottom .inner { display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }

@media (max-width: 1080px) {
  .hero .inner, .split { grid-template-columns: 1fr; }
  .prod-grid, .prod-grid.four, .cat-tiles, .trio, .valuecards, .testi-grid, .area-grid, .blog-grid, .form-grid { grid-template-columns: repeat(2,1fr); }
  .ftr-main { grid-template-columns: 1fr 1fr; }
  .hero h1 { font-size:48px; }
}
@media (max-width: 640px) {
  .prod-grid, .prod-grid.four, .cat-tiles, .trio, .valuecards, .testi-grid, .area-grid, .blog-grid, .form-grid, .ftr-main { grid-template-columns: 1fr; }
  .hero h1, .pagehead h1 { font-size:38px; }
}

/* =========================================================================
   2026-07-20 HOMEPAGE REDESIGN ADDITIONS (arcmail-demo merge)
   Namespaced hp2-* / ph-* so the 13 interior pages are unaffected.
   Adopts: full-bleed photo hero, trust strip, caution-stripe divider,
   fleet spec rows, Daily/Weekly/Monthly terms band, city checklist grid.
   ========================================================================= */

/* ---------- photo placeholders (swap for Bruce's real photos) ---------- */
.ph { position:relative; }
.ph .ph-tag { position:absolute; top:12px; right:12px; z-index:3; display:inline-flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.14em; font-weight:700; color:#fff;
  background:rgba(15,42,71,.78); border:1px dashed rgba(255,255,255,.55); border-radius:var(--radius-xs); padding:4px 9px; }
.ph .ph-tag .lic { width:13px; height:13px; }
.ph .ph-note { position:absolute; top:46px; right:12px; z-index:3; max-width:250px; text-align:right;
  font-size:11px; line-height:1.45; color:rgba(255,255,255,.7); }

/* ---------- square accent marker (industrial signature) ---------- */
.hp2-sq { display:inline-block; width:10px; height:10px; background:var(--orange-500); flex:none; }

/* ---------- hero: full-bleed photo, bottom-left content ---------- */
.hp2-hero { position:relative; background:var(--navy-950); color:#fff; overflow:hidden;
  display:flex; align-items:flex-end; min-height:min(82vh, 740px); }
.hp2-hero-media { position:absolute; inset:0; background:
  repeating-linear-gradient(-45deg, rgba(255,255,255,.028) 0 2px, transparent 2px 26px),
  radial-gradient(1100px 520px at 78% 8%, rgba(95,180,244,.20), transparent 62%),
  linear-gradient(180deg, var(--navy-800), var(--navy-950) 70%); }
.hp2-hero-scrim { position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg, rgba(7,24,43,.92) 0%, rgba(7,24,43,.55) 46%, rgba(7,24,43,.18) 100%); }
.hp2-hero-inner { position:relative; z-index:2; padding-block:96px 60px; }
.hp2-kicker { display:inline-flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:600;
  font-size:13px; text-transform:uppercase; letter-spacing:.2em; color:var(--sky-400); margin:0 0 18px; }
.hp2-hero h1 { font-family:var(--font-display); font-weight:700; text-transform:uppercase; letter-spacing:-.01em;
  line-height:.97; font-size:clamp(44px, 6.6vw, 84px); color:#fff; margin:0; max-width:920px; }
.hp2-hero h1 .accent { color:var(--orange-500); }
.hp2-hero-sub { color:var(--fg-on-dark-2); font-size:19px; line-height:1.6; margin:20px 0 0; max-width:580px; }

/* ---------- trust strip under hero ---------- */
.hp2-trust { background:var(--navy-950); border-top:1px solid rgba(255,255,255,.08); position:relative; }
.hp2-trust-grid { display:grid; grid-template-columns:repeat(3,1fr); }
.hp2-trust .t { display:flex; align-items:center; gap:14px; padding:18px 18px 18px 0; }
.hp2-trust .t + .t { border-left:1px solid rgba(255,255,255,.1); padding-left:22px; }
.hp2-trust .bar { width:6px; height:34px; background:var(--orange-500); flex:none; }
.hp2-trust b { display:block; font-family:var(--font-display); font-weight:700; text-transform:uppercase;
  letter-spacing:.05em; font-size:15px; color:#fff; }
.hp2-trust small { display:block; font-size:13px; color:var(--fg-on-dark-2); }

/* ---------- caution-stripe divider ---------- */
.hp2-stripe { height:10px; background:repeating-linear-gradient(-45deg, var(--navy-950) 0 22px, var(--orange-500) 22px 44px); }

/* ---------- display-grade section headings ---------- */
.hp2-h2 { text-transform:uppercase; letter-spacing:-.01em; line-height:1.02; font-size:clamp(30px, 4vw, 44px); }
.hp2-flexhead { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-bottom:40px; }
.hp2-flexhead .side { max-width:390px; font-size:15.5px; color:var(--fg-3); margin:0; line-height:1.6; }

/* ---------- fleet card upgrades: corner tag + capacity spec row ---------- */
.hp2-tag { display:inline-block; background:var(--navy-900); color:#fff; font-family:var(--font-display);
  font-weight:600; font-size:11px; text-transform:uppercase; letter-spacing:.1em; padding:4px 10px; }
.hp2-spec { display:flex; align-items:baseline; justify-content:space-between;
  border-block:1px solid var(--gray-200); padding:10px 0; margin-top:12px; }
.hp2-spec .k { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:var(--gray-500); }
.hp2-spec .v { font-family:var(--font-display); font-weight:700; font-size:18px; color:var(--navy-900);
  font-variant-numeric:tabular-nums; }
.hp2-spec + .pmeta { margin-top:8px; }

/* ---------- rental terms: dark full-bleed band ---------- */
.hp2-terms { background:var(--navy-950); color:var(--fg-on-dark-2); padding-block:76px; }
.hp2-terms-head { max-width:680px; margin-bottom:38px; }
.hp2-terms-head h2 { color:#fff; margin:0 0 14px; }
.hp2-terms-head p { color:var(--fg-on-dark-2); font-size:17px; margin:0; line-height:1.6; }
.hp2-terms-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.hp2-terms .tcard { background:var(--navy-900); border-top:4px solid var(--sky-600);
  border-radius:var(--radius-md); padding:26px; }
.hp2-terms .tcard.hot { border-top-color:var(--orange-500); }
.hp2-terms .tcard small { display:block; font-family:var(--font-display); font-weight:600; font-size:12.5px;
  text-transform:uppercase; letter-spacing:.12em; color:var(--sky-400); }
.hp2-terms .tcard b { display:block; font-family:var(--font-display); font-weight:700;
  font-size:clamp(30px, 3vw, 42px); text-transform:uppercase; color:#fff; line-height:1.05; margin:6px 0 10px; }
.hp2-terms .tcard p { margin:0; font-size:15px; line-height:1.6; color:var(--fg-on-dark-2); }
.hp2-chiprow { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:22px; }
.hp2-chip { display:flex; gap:12px; align-items:flex-start; border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius-md); padding:16px 18px; }
.hp2-chip .hp2-sq { margin-top:5px; }
.hp2-chip b { display:block; font-family:var(--font-display); font-weight:700; text-transform:uppercase;
  letter-spacing:.04em; font-size:15px; color:#fff; }
.hp2-chip small { display:block; font-size:13.5px; color:var(--fg-on-dark-2); margin-top:2px; }
.hp2-terms-cta { display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:34px; }
.hp2-terms-cta p { margin:0; font-size:14.5px; color:var(--fg-on-dark-2); }
.hp2-terms-cta a.tel { color:#fff; font-weight:700; text-decoration:underline; text-underline-offset:4px; }

/* ---------- about sign-off ---------- */
.hp2-signoff { display:flex; align-items:baseline; gap:14px; border-top:1px solid var(--gray-200);
  margin-top:24px; padding-top:18px; }
.hp2-signoff .name { font-family:var(--font-display); font-weight:700; text-transform:uppercase;
  letter-spacing:.03em; font-size:17px; color:var(--navy-900); }
.hp2-signoff .role { font-size:14px; color:var(--fg-3); }

/* ---------- service-area city checklist ---------- */
.hp2-cities { list-style:none; margin:22px 0 0; padding:0; display:grid;
  grid-template-columns:repeat(3,1fr); gap:10px 16px; }
.hp2-cities li { display:flex; align-items:center; gap:9px; font-weight:600; font-size:15px; color:var(--navy-900); }
.hp2-cities .hp2-sq { width:7px; height:7px; }
.hp2-outside { font-size:14px; color:var(--fg-3); margin-top:18px; }
.hp2-outside a { color:var(--navy-900); font-weight:700; text-decoration:underline; text-underline-offset:3px; }

/* ---------- media-panel photo caption ---------- */
.hp2-caption { position:absolute; left:0; right:0; bottom:0; z-index:2; padding:16px 20px;
  background:linear-gradient(0deg, rgba(7,24,43,.9), transparent); font-family:var(--font-display);
  font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:#fff; font-size:15px; }

/* ---------- responsive ---------- */
@media (max-width: 1080px) {
  .hp2-trust-grid, .hp2-terms-grid, .hp2-chiprow { grid-template-columns:1fr; }
  .hp2-trust .t { padding-right:0; }
  .hp2-trust .t + .t { border-left:none; border-top:1px solid rgba(255,255,255,.1); padding-left:0; }
  .hp2-flexhead { flex-direction:column; align-items:flex-start; gap:12px; }
  .hp2-cities { grid-template-columns:repeat(2,1fr); }
  .hp2-hero-inner { padding-block:80px 52px; }
}
@media (max-width: 640px) {
  .hp2-hero { min-height:0; }
  .hp2-hero h1 { font-size:40px; }
  .hp2-hero-sub { font-size:17px; }
  .hp2-hero .ph-note { display:none; }
  .hp2-terms { padding-block:56px; }
}

/* ---- Real equipment photos (Quipli) + hide placeholder overlays ---- */
.ph .ph-tag, .ph .ph-note { display:none !important; }
.prod-thumb .prod-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:1; }
.prod-thumb .cond { z-index:2; }
.prod-thumb.has-photo { background:#0f2a47; }
.hp2-hero-media.has-photo { background-image:linear-gradient(90deg, rgba(15,42,71,.72), rgba(15,42,71,.35)), url('assets/quipli-product-6.jpg'); background-size:cover; background-position:center right; }

/* ---- footer backlinks + media-panel photos + inventory photos ---- */
.ftr-bottom .built a { color:#6ab9f9; text-decoration:none; }
.ftr-bottom .built a:hover { text-decoration:underline; }
.media-panel.ph > svg, .media-panel.ph .ptitle, .media-panel.ph .psub { display:none !important; }
.media-panel.has-photo { background-size:cover; background-position:center; }
.media-panel.about.has-photo { background-image:linear-gradient(180deg, rgba(15,42,71,.10), rgba(15,42,71,.50)), url('assets/bruce-moore-headshot.png'); background-position:center 18%; }
.media-panel.ph:not(.has-photo) { background:linear-gradient(135deg,#0f2a47,#173a5e); }
.prod-thumb .photo-tag { display:none !important; }