/*
Theme Name: Venco Delivery
Theme URI: https://vencodelivery.com
Author: Venco Delivery LLC
Author URI: https://vencodelivery.com
Description: Custom one-page recruiting theme for Venco Delivery LLC, inspired by the Transpi "Home Three" trucking/logistics layout. Features hero slider with overlay application form, animated stat counters, pricing cards, fleet gallery, benefits grid, accordion requirements, testimonials and CTA/contact/footer sections. Fully responsive with on-scroll fade-up animations.
Version: 1.0.0
Requires at least: 5.8
Requires PHP: 7.4
Text Domain: venco-delivery
*/

:root{
  --color-navy:#0b1d3a;
  --color-navy-dark:#071429;
  --color-red:#c8102e;
  --color-red-dark:#9c0c22;
  --color-white:#ffffff;
  --color-gray-light:#f4f6f9;
  --color-gray:#6b7480;
  --color-gold:#f2b90c;
  --font-heading:'Outfit', sans-serif;
  --font-body:'DM Sans', sans-serif;
  --radius:10px;
  --shadow:0 10px 30px rgba(11,29,58,0.12);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--color-navy);
  background:#fff;
  line-height:1.6;
  overflow-x:hidden;
}
h1,h2,h3,h4,h5,h6{font-family:var(--font-heading); font-weight:700; margin:0 0 16px; color:var(--color-navy);}
a{text-decoration:none; color:inherit;}
img{max-width:100%; display:block;}
ul{margin:0; padding:0; list-style:none;}
.container{max-width:1240px; margin:0 auto; padding:0 20px;}
.btn{
  display:inline-block;
  font-family:var(--font-heading);
  font-weight:600;
  padding:14px 32px;
  border-radius:6px;
  background:var(--color-red);
  color:#fff;
  transition:all .3s ease;
  border:2px solid var(--color-red);
  cursor:pointer;
  font-size:15px;
  letter-spacing:.5px;
}
.btn:hover{ background:var(--color-navy); border-color:var(--color-navy); transform:translateY(-2px); }
.btn-outline{ background:transparent; color:var(--color-navy); border:2px solid var(--color-navy);}
.btn-outline:hover{ background:var(--color-navy); color:#fff;}
.section-label{
  display:inline-block; color:var(--color-red); font-weight:700; letter-spacing:2px;
  text-transform:uppercase; font-size:13px; margin-bottom:10px;
}
.section-pad{ padding:90px 0; }
@media(max-width:768px){ .section-pad{ padding:60px 0; } }

/* fade-up animation */
.fade-up{ opacity:0; transform:translateY(60px); transition:opacity .8s ease, transform .8s ease; }
.fade-up.is-visible{ opacity:1; transform:translateY(0); }
.fade-up-delay-1.is-visible{ transition-delay:.1s; }
.fade-up-delay-2.is-visible{ transition-delay:.2s; }
.fade-up-delay-3.is-visible{ transition-delay:.3s; }
.fade-up-delay-4.is-visible{ transition-delay:.4s; }

/* ===== TOP BAR ===== */
.topbar{ background:var(--color-navy-dark); color:#cfd8e6; font-size:13px; padding:8px 0; }
.topbar .container{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;}
.topbar a{ color:#cfd8e6; }
.topbar .topbar-left{ display:flex; gap:24px; flex-wrap:wrap; }
.topbar .topbar-left span{ display:inline-flex; align-items:center; gap:6px;}
.topbar .topbar-social a{ margin-left:12px; opacity:.8; }
.topbar .topbar-social a:hover{ opacity:1; color:var(--color-gold);}
@media(max-width:991px){
  .topbar{ display:none; }
}

/* ===== MAIN NAV ===== */
.main-header{ background:#fff; box-shadow:0 2px 15px rgba(0,0,0,.06); position:sticky; top:0; z-index:999;}
.main-header .container{ display:flex; align-items:center; justify-content:space-between; padding:16px 24px; gap:32px;}
.site-logo{ display:flex; align-items:center; flex-shrink:0; margin-right:16px;}
.site-logo img{ height:82px; width:auto;}
.icon-svg{ width:16px; height:16px; vertical-align:-3px; margin-right:2px;}
.topbar-social .icon-svg{ width:18px; height:18px; margin-right:0;}
.main-nav{ flex:1; display:flex; justify-content:center;}
.main-nav ul{ display:flex; gap:32px; align-items:center;}
.main-nav a{ font-weight:600; font-size:15px; color:var(--color-navy); position:relative; padding:6px 0; white-space:nowrap;}
.main-nav a:hover{ color:var(--color-red); }
.header-cta{ display:flex; align-items:center; gap:20px; flex-shrink:0; margin-left:16px;}
.nav-toggle{ display:none; align-items:center; justify-content:center; width:52px; height:52px; background:none; border:none; cursor:pointer; color:var(--color-navy); position:relative; z-index:12;}
.nav-toggle-box{ position:relative; width:28px; height:20px; display:block;}
.nav-line{ position:absolute; left:0; width:100%; height:2.5px; border-radius:999px; background:var(--color-navy); transform-origin:center; transition:transform .38s cubic-bezier(0.16, 1, 0.3, 1), top .38s cubic-bezier(0.16, 1, 0.3, 1), opacity .24s ease, background .24s ease; }
.nav-line-1{ top:0; }
.nav-line-2{ top:8.5px; }
.nav-line-3{ top:17px; }
.nav-toggle.is-active .nav-line-1{ top:8.5px; transform:rotate(45deg); }
.nav-toggle.is-active .nav-line-2{ opacity:0; transform:scaleX(.2); }
.nav-toggle.is-active .nav-line-3{ top:8.5px; transform:rotate(-45deg); }
.nav-toggle:hover .nav-line-1, .nav-toggle:hover .nav-line-3{ width:100%; }
.nav-toggle:focus-visible{ outline:2px solid var(--color-red); outline-offset:4px; border-radius:10px; }
.mobile-cta{ display:none; }
@media(max-width:991px){
  .main-header .container{ padding:12px 20px; gap:16px;}
  .site-logo img{ height:56px; }
  .main-nav{ display:none; position:absolute; top:100%; left:0; right:0; background:#fff; box-shadow:0 10px 20px rgba(0,0,0,.08); padding:20px; flex:none;}
  .main-nav.open{ display:block; animation:navFadeIn .28s cubic-bezier(0.16, 1, 0.3, 1); }
  .main-nav ul{ flex-direction:column; gap:16px; align-items:flex-start;}
  .nav-toggle{ display:block; }
  .header-cta{ display:none; }
  .mobile-cta{ display:block; width:100%; margin-top:8px; padding-top:16px; border-top:1px solid #eef0f4;}
  .mobile-cta .btn{ display:block; text-align:center; width:100%;}
}

/* ===== HERO SLIDER ===== */
.hero{
  position:relative;
  min-height:92vh;
  display:flex;
  align-items:center;
  background:linear-gradient(120deg, rgba(7,20,41,.92), rgba(11,29,58,.75)), url('assets/images/hero-truck.jpg') center/cover no-repeat;
  color:#fff;
  overflow:hidden;
}
.hero::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.55));
  z-index:1;
}
.hero .container{ position:relative; z-index:2; display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:center; padding:60px 20px;}
.hero-badge{
  display:inline-flex; align-items:center; gap:8px; background:var(--color-red);
  padding:8px 18px; border-radius:30px; font-weight:700; font-size:13px; letter-spacing:1px; margin-bottom:20px;
}
.hero h1{ color:#fff; font-size:48px; line-height:1.15; margin-bottom:20px;}
.hero h1 .accent{ color:var(--color-gold); }
.hero p.lead{ font-size:18px; color:#dbe3ef; max-width:520px; margin-bottom:30px;}
.hero-buttons{ display:flex; gap:16px; flex-wrap:wrap;}

/* form card */
.form-card{
  background:#fff; border-radius:var(--radius); padding:32px; box-shadow:var(--shadow); color:var(--color-navy);
}
.form-card h3{ font-size:22px; margin-bottom:4px;}
.form-card .form-sub{ color:var(--color-gray); font-size:14px; margin-bottom:20px;}
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.form-grid .full{ grid-column:1/-1; }
.form-card label{ display:flex; font-size:13px; font-weight:600; margin-bottom:6px; color:var(--color-navy);}
.form-card input, .form-card select{
  width:100%; padding:12px 14px; border:1px solid #dfe4ec; border-radius:6px; font-family:var(--font-body); font-size:14px; background:#f9fafc;
}
.radio-group{ display:flex; gap:24px; align-items:center; margin-top:6px;}
.radio-group label{ display:flex; align-items:center; gap:8px; font-weight:500; margin-bottom:0; cursor:pointer; line-height:1;}
.radio-group label input[type="radio"]{ width:16px; height:16px; margin:0; accent-color:var(--color-red); cursor:pointer;}
.form-card .btn{ width:100%; margin-top:10px; text-align:center;}
.consent-note{ font-size:11px; color:var(--color-gray); margin-top:12px; line-height:1.5;}
@media(max-width:991px){
  .hero .container{ grid-template-columns:1fr; }
  .hero h1{ font-size:34px; }
}
@media(max-width:600px){
  .form-grid{ grid-template-columns:1fr; }
}

/* ===== STATS COUNTER ===== */
.stats{ background:var(--color-navy); color:#fff; padding:50px 0;}
.stats .container{ display:grid; grid-template-columns:repeat(4,1fr); gap:30px; text-align:center;}
.stat-item .num{ font-family:var(--font-heading); font-size:42px; font-weight:800; color:var(--color-gold); margin-bottom:6px;}
.stat-item .label{ font-size:14px; color:#c8d2e2; text-transform:uppercase; letter-spacing:1px;}
@media(max-width:768px){ .stats .container{ grid-template-columns:repeat(2,1fr); } }

/* ===== ABOUT ===== */
.about .container{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
.about img{ border-radius:var(--radius); box-shadow:var(--shadow);}
@media(max-width:900px){ .about .container{ grid-template-columns:1fr; } }

/* ===== PRICING / PAY CARDS ===== */
.pay-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; margin-top:40px;}
.pay-card{
  background:#fff; border-radius:var(--radius); padding:36px 28px; box-shadow:var(--shadow); border-top:5px solid var(--color-red); transition:transform .3s ease;
}
.pay-card:hover{ transform:translateY(-8px); }
.pay-card h3{ font-size:20px; margin-bottom:18px; color:var(--color-navy);}
.pay-card ul li{ display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px dashed #e5e9f0; font-size:14px;}
.pay-card ul li:last-child{ border-bottom:none;}
.pay-card ul li strong{ color:var(--color-red); }
@media(max-width:991px){ .pay-grid{ grid-template-columns:1fr; } }

/* ===== FLEET GALLERY ===== */
.fleet{ background:var(--color-gray-light); }
.fleet-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; margin-top:40px;}
.fleet-item{ background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow);}
.fleet-item img{ height:220px; width:100%; object-fit:cover;}
.fleet-item .fleet-text{ padding:20px;}
.fleet-item h4{ font-size:16px; margin-bottom:6px;}
.fleet-item p{ font-size:13px; color:var(--color-gray); margin:0;}
@media(max-width:768px){ .fleet-grid{ grid-template-columns:1fr; } }

/* ===== BENEFITS ===== */
.benefits-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:40px;}
.benefit-box{ background:#fff; border:1px solid #eef0f4; padding:30px; border-radius:var(--radius); text-align:left;}
.benefit-box .icon{ width:50px; height:50px; border-radius:50%; background:var(--color-red); color:#fff; display:flex; align-items:center; justify-content:center; margin-bottom:16px;}
.benefit-box .icon svg{ width:24px; height:24px;}
.benefit-box h4{ font-size:17px; margin-bottom:8px;}
.benefit-box p{ font-size:14px; color:var(--color-gray); margin:0;}
@media(max-width:991px){ .benefits-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:600px){ .benefits-grid{ grid-template-columns:1fr; } }

/* ===== REQUIREMENTS ACCORDION ===== */
.requirements{ background:var(--color-navy); color:#fff; }
.requirements h2{ color:#fff; }
.accordion{ margin-top:30px; max-width:800px;}
.accordion-item{ border-bottom:1px solid rgba(255,255,255,.15);}
.accordion-header{ display:flex; justify-content:space-between; align-items:center; padding:20px 0; cursor:pointer; font-weight:600; font-size:16px;}
.accordion-header .plus{ font-size:22px; transition:transform .3s ease;}
.accordion-item.active .plus{ transform:rotate(45deg);}
.accordion-body{ max-height:0; overflow:hidden; transition:max-height .35s ease; font-size:14px; color:#d5deec;}
.accordion-item.active .accordion-body{ max-height:200px; padding-bottom:16px;}

/* ===== TESTIMONIALS ===== */
.testimonials-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:30px; margin-top:40px;}
.testimonial-box{ background:var(--color-gray-light); padding:30px; border-radius:var(--radius); position:relative;}
.testimonial-box h4{ color:var(--color-red); font-size:18px; margin-bottom:12px;}
.testimonial-box p{ font-size:15px; color:var(--color-navy); margin-bottom:16px; font-style:italic;}
.testimonial-box .author{ font-weight:700; font-size:14px; color:var(--color-navy);}
@media(max-width:768px){ .testimonials-grid{ grid-template-columns:1fr; } }

/* ===== CTA BANNER ===== */
.cta-banner{
  background:linear-gradient(120deg, var(--color-red-dark), var(--color-red));
  color:#fff; text-align:center; padding:70px 0;
}
.cta-banner h2{ color:#fff; font-size:34px; margin-bottom:12px;}
.cta-banner p{ font-size:17px; margin-bottom:26px; opacity:.95;}
.cta-banner .btn-outline{ border-color:#fff; color:#fff; }
.cta-banner .btn-outline:hover{ background:#fff; color:var(--color-red); }

/* ===== CONTACT ===== */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:50px; margin-top:40px;}
.contact-info li{ display:flex; gap:12px; padding:12px 0; border-bottom:1px solid #eef0f4; font-size:15px;}
.contact-info li strong{ min-width:150px; display:inline-block; color:var(--color-navy);}
.map-embed iframe{ width:100%; height:100%; min-height:320px; border:0; border-radius:var(--radius);}
@media(max-width:900px){ .contact-grid{ grid-template-columns:1fr; } }

/* ===== FOOTER ===== */
.site-footer{ background:var(--color-navy-dark); color:#c8d2e2; padding:50px 0 20px;}
.footer-top{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:30px; padding-bottom:30px; border-bottom:1px solid rgba(255,255,255,.1);}
.footer-brand{ display:flex; flex-direction:column; align-items:flex-start; text-align:left; gap:10px;}
.footer-logo{ height:82px; width:auto; object-fit:contain; display:block;}
.footer-links ul{ display:flex; gap:24px; flex-wrap:wrap;}
.footer-links a:hover{ color:var(--color-gold); }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; padding-top:20px; font-size:13px;}
.footer-bottom a{ margin-left:16px;}
.footer-bottom a:hover{ color:var(--color-gold); }

.consent-checkbox{ margin-top:6px; }
.checkbox-label{ display:flex; align-items:center; gap:10px; font-weight:400 !important; cursor:pointer; }
.checkbox-label input[type="checkbox"]{ width:18px; height:18px; margin:0; flex-shrink:0; accent-color:var(--color-red); cursor:pointer; }
.checkbox-label strong{ color:var(--color-navy); font-size:13px; font-weight:600; line-height:1; }
.consent-fine-print{ font-size:12px; line-height:1.6; color:var(--color-gray); margin:8px 0 0; }
.consent-fine-print a{ color:var(--color-red); text-decoration:underline; }
.consent-fine-print a:hover{ color:var(--color-navy); }

.legal-page h1{ font-size:34px; margin-bottom:6px;}
.legal-page h2{ font-size:24px; margin-top:40px; margin-bottom:14px; color:var(--color-red);}
.legal-page h3{ font-size:18px; margin-top:26px; margin-bottom:10px;}
.legal-page h4{ font-size:15px; margin-top:16px; margin-bottom:8px;}
.legal-page p, .legal-page li{ font-size:14.5px; color:var(--color-gray); line-height:1.8;}
.legal-page ul{ padding-left:22px; margin-bottom:16px;}
.legal-page ul li{ list-style:disc; margin-bottom:6px;}
.legal-page a{ color:var(--color-red); text-decoration:underline;}
.legal-page a:hover{ color:var(--color-navy);}
.legal-page strong{ color:var(--color-navy);}

@keyframes navFadeIn{from{opacity:0; transform:translateY(-10px);}to{opacity:1; transform:translateY(0);}}