/* ==========================================================================
   HONESTECH THEME — shared design system, matched to the links page.
   Loaded by every public page. Edit colors here once.
   ========================================================================== */
:root{
  --navy-deep:#040B1E;
  --navy:#06102A;
  --navy-mid:#0B1A44;
  --blue:#1E5BD8;
  --blue-hi:#3B7BFF;
  --orange:#FF7A00;
  --orange-hi:#FF9A1F;
  --orange-lo:#E86200;
  --white:#FFFFFF;
  --dim:#A9B4CF;
  --text:#C2CCE2;
  --line:#16306B;
  --green:#35D46A;
  --red:#FF3B2F;
  /* legacy names used by older pages */
  --black:#040B1E; --dark:#06102A; --card:#0B1A44; --border:#16306B;
  --orange-light:#FF9A1F; --yellow:#FF7A00; --yellow-light:#FF9A1F; --muted:#A9B4CF;
  color-scheme:dark;
}

/* ---------- page canvas: hex texture, blue glow, racing stripes ---------- */
html,body{background-color:var(--navy-deep) !important;}
body{
  color:var(--text);
  font-family:'Montserrat',sans-serif;
  background-image:
    radial-gradient(ellipse at 30% 0%, rgba(30,91,216,0.35), transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cpath fill='%232a5bd0' fill-opacity='0.16' d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/svg%3E") !important;
  background-attachment:fixed !important;
  overflow-x:hidden;
}
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:linear-gradient(118deg,
    transparent 0 8%,
    rgba(255,122,0,0.85) 8% 11%,
    transparent 11% 12.5%,
    rgba(30,91,216,0.8) 12.5% 14%,
    transparent 14% 78%,
    rgba(30,91,216,0.7) 78% 79.5%,
    transparent 79.5% 81%,
    rgba(255,122,0,0.8) 81% 85%,
    transparent 85% 100%);
  opacity:0.32;
}
body > *{position:relative; z-index:1;}
body > nav{position:fixed; z-index:100;}
section, .section-full, .services-section, .quote-section{background:transparent !important;}
.hero-grid{display:none !important;}
.hero-bg{background:radial-gradient(ellipse 60% 50% at 70% 40%, rgba(255,122,0,0.14) 0%, transparent 70%) !important;}

/* ---------- stripe bars (top of nav, bottom of footer) ---------- */
.ht-topbar, .ht-bottombar{height:8px; box-shadow:0 0 14px rgba(255,122,0,0.5);}
.ht-topbar{background:linear-gradient(90deg, var(--blue) 0 30%, var(--orange) 30% 100%);}
.ht-bottombar{background:linear-gradient(90deg, var(--orange) 0 70%, var(--blue) 70% 100%);}

/* ---------- nav ---------- */
nav{
  background:rgba(4,11,30,0.94) !important;
  backdrop-filter:blur(12px);
  border-bottom:2px solid var(--orange) !important;
  box-shadow:0 6px 18px rgba(0,0,0,0.5);
}
nav::before{
  content:""; position:absolute; left:0; right:0; top:0; height:5px;
  background:linear-gradient(90deg, var(--blue) 0 30%, var(--orange) 30% 100%);
  box-shadow:0 0 12px rgba(255,122,0,0.5);
}
nav img{filter:drop-shadow(0 4px 8px rgba(0,0,0,0.6));}
.nav-links a{
  font-family:'Oswald',sans-serif !important; font-weight:600 !important;
  font-size:0.9rem !important; letter-spacing:0.06em !important;
  text-transform:uppercase; color:var(--text) !important;
}
.nav-links a:hover{color:var(--orange) !important;}
.nav-phone{font-family:'Anton',sans-serif !important; font-weight:400 !important; color:var(--orange) !important; font-size:1.05rem !important; letter-spacing:0.02em !important;}

/* ---------- the orange slash (buttons + banners) ---------- */
.ht-slash, .btn-primary, .nav-cta, .form-submit, .mobile-cta, .submit-btn, .btn-dark{
  position:relative;
  display:inline-flex; align-items:center; justify-content:center; gap:0.5rem;
  font-family:'Anton',sans-serif !important; font-weight:400 !important;
  font-size:1.1rem; letter-spacing:0.04em; text-transform:uppercase;
  color:#0A0A0A !important; text-decoration:none;
  background:linear-gradient(100deg, var(--orange-hi), var(--orange) 60%, var(--orange-lo)) !important;
  border:none !important; border-radius:0 !important;
  padding:0.85rem 2.1rem 0.8rem 2.4rem;
  clip-path:polygon(5% 0, 100% 0, 95% 100%, 0 100%);
  box-shadow:0 8px 18px rgba(0,0,0,0.5);
  cursor:pointer;
  transition:transform .12s ease, filter .12s ease;
}
.ht-slash::before, .btn-primary::before, .form-submit::before, .mobile-cta::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:14px;
  background:linear-gradient(100deg, var(--blue) 0 50%, #fff 50% 70%, transparent 70%);
}
.ht-slash:hover, .btn-primary:hover, .nav-cta:hover, .form-submit:hover, .mobile-cta:hover, .btn-dark:hover{
  transform:translateX(3px); filter:brightness(1.08);
}
.nav-cta{font-size:0.95rem !important; padding:0.45rem 1.3rem 0.4rem 1.4rem !important;}

/* outline partner button */
.ht-ghost, .btn-secondary{
  display:inline-flex; align-items:center; justify-content:center; gap:0.5rem;
  font-family:'Anton',sans-serif !important; font-weight:400 !important;
  font-size:1.1rem; letter-spacing:0.04em; text-transform:uppercase;
  color:var(--white) !important; text-decoration:none;
  background:rgba(4,11,30,0.9) !important;
  border:2px solid var(--blue) !important; border-left:6px solid var(--orange) !important;
  border-radius:6px !important;
  padding:0.75rem 1.6rem 0.7rem;
  box-shadow:0 6px 14px rgba(0,0,0,0.45);
  transition:transform .12s ease, box-shadow .12s ease;
}
.ht-ghost:hover, .btn-secondary:hover{transform:translateX(3px); box-shadow:0 8px 18px rgba(0,0,0,0.55), 0 0 12px rgba(255,122,0,0.3); color:var(--white) !important;}

/* ---------- labels + headings ---------- */
.label, .ht-label{
  display:flex !important; align-items:center; gap:10px;
  font-family:'Montserrat',sans-serif !important; font-weight:600;
  font-size:0.72rem !important; letter-spacing:0.28em !important;
  text-transform:uppercase; color:var(--white) !important;
  margin-bottom:0.8rem;
}
.label::before, .ht-label::before{content:""; width:34px; height:2px; background:var(--orange); flex-shrink:0;}
main h1, .hero-title{
  font-family:'Anton',sans-serif; color:var(--white);
  text-shadow:0 6px 18px rgba(0,0,0,0.55);
}
main h1{text-transform:uppercase; line-height:0.95 !important;}
main h2, .section-title{font-family:'Anton',sans-serif; color:var(--white); letter-spacing:0.03em; text-transform:uppercase;}
.accent{color:var(--orange) !important;}
.breadcrumb, .breadcrumb a{font-family:'Oswald',sans-serif; letter-spacing:0.06em; text-transform:uppercase; font-size:0.78rem;}
.breadcrumb a:hover{color:var(--orange) !important;}

/* ---------- status lamp panel ---------- */
.ht-status{
  display:flex; align-items:center; gap:10px;
  background:rgba(4,11,30,0.9);
  border:2px solid var(--blue); border-left:6px solid var(--orange);
  border-radius:6px; padding:10px 14px;
  box-shadow:0 6px 14px rgba(0,0,0,0.45);
}
.ht-lamp{width:12px; height:12px; border-radius:50%; flex-shrink:0; background:var(--green); box-shadow:0 0 10px 3px rgba(53,212,106,0.65);}
.ht-lamp.off{background:var(--red); box-shadow:0 0 10px 3px rgba(255,59,47,0.65);}
.ht-status-text{font-family:'Oswald',sans-serif; font-weight:700; font-size:15px; letter-spacing:0.06em; text-transform:uppercase; color:var(--white);}
.ht-status-text .hrs{display:block; font-family:'Montserrat',sans-serif; font-weight:600; font-size:10.5px; color:var(--dim); letter-spacing:0.08em; margin-top:1px;}

/* ---------- link rows + skewed badges ---------- */
.ht-row{
  position:relative; display:flex; align-items:center; gap:14px;
  text-decoration:none; color:var(--white);
  background:linear-gradient(90deg, rgba(11,26,68,0.95), rgba(4,11,30,0.95));
  border-bottom:2px solid var(--orange);
  padding:10px 16px 10px 10px;
  box-shadow:0 6px 14px rgba(0,0,0,0.45);
  transition:transform .12s ease, box-shadow .12s ease;
}
a.ht-row:hover, a.ht-row:focus-visible, button.ht-row:hover{transform:translateX(3px); box-shadow:0 8px 18px rgba(0,0,0,0.55), 0 0 12px rgba(255,122,0,0.3); outline:none;}
.ht-badge{
  width:62px; height:46px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  transform:skewX(-14deg);
  background:linear-gradient(160deg, #164BC0, #0A205A);
  border:2px solid var(--blue-hi);
  box-shadow:inset 0 0 10px rgba(0,0,0,0.5), 3px 0 0 var(--orange);
}
.ht-badge svg{width:26px; height:26px; transform:skewX(14deg);}
.ht-badge svg *{stroke:var(--orange); fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.ht-badge svg .fill{fill:var(--orange); stroke:none;}
.ht-rlabel{flex:1; min-width:0;}
.ht-rlabel .l{font-family:'Oswald',sans-serif; font-weight:700; font-size:18px; text-transform:uppercase; letter-spacing:0.03em; display:block; line-height:1.15; color:var(--white);}
.ht-rlabel .s{font-size:12.5px; font-weight:500; color:var(--dim); display:block; margin-top:2px; line-height:1.5;}
.ht-chevron{color:var(--orange); font-family:'Anton',sans-serif; font-size:22px; flex-shrink:0;}

/* ---------- service tiles + area plate ---------- */
.ht-svc{
  font-family:'Oswald',sans-serif; font-weight:600; font-size:13px;
  text-transform:uppercase; letter-spacing:0.04em; color:var(--white);
  text-align:center; padding:8px 6px;
  background:rgba(4,11,30,0.9);
  border:1px solid var(--blue); border-top:2px solid var(--orange);
}
.ht-plate{
  background:rgba(4,11,30,0.92);
  border:2px solid var(--orange); border-radius:10px;
  padding:16px 18px;
  box-shadow:0 6px 14px rgba(0,0,0,0.45);
}
.ht-plate .head{font-family:'Anton',sans-serif; font-size:18px; letter-spacing:0.06em; text-transform:uppercase; color:var(--orange); margin-bottom:6px;}
.ht-dot{display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:6px; vertical-align:middle;}
.ht-dot.green{background:var(--green); box-shadow:0 0 6px rgba(53,212,106,0.7);}
.ht-dot.amber{background:var(--orange); box-shadow:0 0 6px rgba(255,122,0,0.7);}

/* ---------- slogan ---------- */
.ht-slogan{text-align:center; padding:8px 6px 0;}
.ht-slogan .l1, .ht-slogan .l2{font-family:'Montserrat',sans-serif; font-weight:600; font-size:clamp(11px,3.4vw,14px); letter-spacing:0.28em; text-transform:uppercase;}
.ht-slogan .l1{display:flex; align-items:center; gap:10px; color:var(--white);}
.ht-slogan .l1::before, .ht-slogan .l1::after{content:""; flex:1; height:2px; background:var(--orange);}
.ht-slogan .l2{color:var(--orange); margin-top:6px;}

/* ==========================================================================
   Legacy page components (town, county, gig, terms, privacy) restyled
   ========================================================================== */
.service-item, .town-link, .town-card, .why-item, .platform-pill{
  background:linear-gradient(90deg, rgba(11,26,68,0.95), rgba(4,11,30,0.95)) !important;
  border:none !important; border-bottom:2px solid var(--orange) !important;
  border-radius:0 !important;
  box-shadow:0 6px 14px rgba(0,0,0,0.45);
  color:var(--white) !important;
  transition:transform .12s ease, box-shadow .12s ease;
}
.service-item{font-family:'Oswald',sans-serif !important; font-weight:600 !important; text-transform:uppercase; letter-spacing:0.03em; font-size:0.95rem !important; border-left:4px solid var(--blue) !important;}
.service-item.highlight{border-left-color:var(--orange) !important;}
.town-link, .town-card{font-family:'Oswald',sans-serif !important; font-weight:600; text-transform:uppercase; letter-spacing:0.04em;}
a.town-link:hover, a.town-card:hover, .town-card:hover{transform:translateX(3px); box-shadow:0 8px 18px rgba(0,0,0,0.55), 0 0 12px rgba(255,122,0,0.3); color:var(--orange) !important;}
.why-grid{background:transparent !important; border:none !important; gap:10px !important; border-radius:0 !important; overflow:visible !important;}
.why-item h4, .why-card .why-title{font-family:'Oswald',sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:var(--white);}
.why-card{
  background:linear-gradient(90deg, rgba(11,26,68,0.95), rgba(4,11,30,0.95)) !important;
  border-bottom:2px solid var(--orange); box-shadow:0 6px 14px rgba(0,0,0,0.45);
}
.cta-box, .offer-box, .highlight-box, .notice{
  background:rgba(4,11,30,0.92) !important;
  border:2px solid var(--orange) !important; border-radius:10px !important;
  box-shadow:0 6px 14px rgba(0,0,0,0.45);
}
.cta-box h2{color:var(--orange) !important; text-transform:uppercase;}
.hero-badge{
  background:rgba(4,11,30,0.9) !important;
  border:2px solid var(--blue) !important; border-left:6px solid var(--orange) !important;
  border-radius:6px !important; color:var(--white) !important;
  font-family:'Oswald',sans-serif !important; letter-spacing:0.08em !important;
}
.hero-badge::before{background:var(--green) !important; box-shadow:0 0 8px 2px rgba(53,212,106,0.65);}
.step-num{
  font-family:'Anton',sans-serif !important; color:#0A0A0A !important;
  background:linear-gradient(100deg, var(--orange-hi), var(--orange) 60%, var(--orange-lo)) !important;
  clip-path:polygon(12% 0, 100% 0, 88% 100%, 0 100%); border-radius:0 !important;
}
.privacy-section, .terms-section{border-left:4px solid var(--orange); padding-left:1.25rem; margin-left:0;}
.privacy-section h2, .terms-section h2{text-transform:uppercase;}

/* mobile menu */
.mobile-menu{background:rgba(4,11,30,0.985) !important; border-top:2px solid var(--orange) !important;}
.mobile-menu a{border-bottom:1px solid var(--line) !important;}
.mobile-menu a:hover, .mobile-menu a.highlight{color:var(--orange) !important;}
.mobile-menu .mobile-phone{font-family:'Anton',sans-serif !important; font-size:1.8rem !important; color:var(--orange) !important;}
.mobile-menu .mobile-cta{width:auto !important; font-size:1.3rem !important; padding:1rem 2.4rem !important;}

/* footer */
footer{
  position:relative;
  background:rgba(4,11,30,0.94) !important;
  border-top:2px solid var(--orange) !important;
  padding-bottom:calc(2rem + 8px) !important;
}
footer::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:8px;
  background:linear-gradient(90deg, var(--orange) 0 70%, var(--blue) 70% 100%);
  box-shadow:0 0 14px rgba(255,122,0,0.5);
}
.footer-links a{font-family:'Oswald',sans-serif; font-weight:500; text-transform:uppercase; letter-spacing:0.06em;}
.footer-links a:hover{color:var(--orange) !important;}

@media (prefers-reduced-motion:reduce){
  *{transition:none !important; animation:none !important;}
}

/* legacy hero pages (gig drivers): keep content clear of the fixed nav */
div.hero, section.hero{padding-top:110px !important; min-height:auto !important;}

/* gig page offer box: navy plate, readable text */
.offer-box h2{color:var(--orange) !important; text-shadow:0 4px 14px rgba(0,0,0,0.5);}
.offer-box p{color:var(--text) !important;}
.offer-box p strong{color:var(--white) !important;}
.offer-box .offer-fine{color:var(--dim) !important;}
.offer-strip{background:linear-gradient(100deg, var(--orange-hi), var(--orange) 60%, var(--orange-lo)) !important; color:#0A0A0A !important;}
