/* ===================================================================
   Solo Logistics — shared stylesheet
   =================================================================== */

:root{
  --navy:#071633;
  --navy-2:#0f2a52;
  --navy-3:#173f78;
  --gold:#f4b942;
  --gold-2:#ffcf6a;
  --teal:#14b8a6;
  --teal-dark:#0d8f81;
  --ink:#0b1220;
  --muted:#5b6b82;
  --paper:#f8f9fb;
  --line:#e6e9f0;
  --radius-lg:20px;
  --radius-md:14px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter',sans-serif;
  color:var(--ink);
  background:var(--paper);
  overflow-x:hidden;
}
h1,h2,h3,h4,.brand{
  font-family:'Poppins',sans-serif;
  font-weight:600;
  color:var(--navy);
}
p{color:var(--muted);}
a{text-decoration:none;}
.section-pad{padding:96px 0;}
.eyebrow-free-head{max-width:680px;}
.gradient-word{
  background:linear-gradient(100deg,var(--gold) 0%,var(--gold-2) 45%,var(--teal) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* Buttons */
.btn-gold{background:var(--gold);border-color:var(--gold);color:var(--navy);font-weight:600;}
.btn-gold:hover{background:var(--gold-2);border-color:var(--gold-2);color:var(--navy);}
.btn-outline-light-custom{border:1.5px solid rgba(255,255,255,.5);color:#fff;font-weight:600;}
.btn-outline-light-custom:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.08);}
.btn-navy{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:600;}
.btn-navy:hover{background:var(--navy-3);border-color:var(--navy-3);color:#fff;}
.btn-teal{background:var(--teal);border-color:var(--teal);color:#fff;font-weight:600;}
.btn-teal:hover{background:var(--teal-dark);border-color:var(--teal-dark);color:#fff;}

/* Topbar */
.topbar{background:var(--navy);color:#c9d4e6;font-size:.85rem;}
.topbar a{color:#c9d4e6;}
.topbar a:hover{color:#fff;}

/* Navbar */
.navbar-brand-mark{
  width:40px;height:40px;border-radius:10px;
  background:linear-gradient(135deg,var(--gold),var(--gold-2));
  display:inline-flex;align-items:center;justify-content:center;font-weight:700;color:var(--navy);margin-right:10px;
}
.navbar-custom{
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(10px);
  box-shadow:0 4px 24px rgba(11,18,32,.06);
  transition:box-shadow .2s ease;
}
.navbar-custom .nav-link{color:var(--navy);font-weight:500;position:relative;}
.navbar-custom .nav-link:hover{color:var(--teal-dark);}
.navbar-custom .nav-link.active{color:var(--teal-dark);}
.navbar-custom .nav-link.active::after{
  content:"";position:absolute;left:8px;right:8px;bottom:-2px;height:2px;background:var(--teal);border-radius:2px;
}
.dropdown-menu{border:none;border-radius:var(--radius-md);box-shadow:0 20px 44px rgba(11,18,32,.12);padding:10px;}
.dropdown-item{border-radius:8px;padding:.55rem .8rem;}
.dropdown-item:hover{background:rgba(20,184,166,.08);color:var(--teal-dark);}

/* Hero (used on all pages, sizes vary) */
.hero{
  position:relative;overflow:hidden;color:#fff;
  background:radial-gradient(1200px 500px at 15% -10%, rgba(244,185,66,.18), transparent 60%),
             radial-gradient(900px 500px at 100% 0%, rgba(20,184,166,.20), transparent 55%),
             linear-gradient(180deg,var(--navy) 0%, var(--navy-2) 100%);
}
.hero-blob{
  position:absolute;border-radius:50%;filter:blur(2px);opacity:.5;pointer-events:none;
}
.hero h1{color:#fff;}
.hero p.lead{color:#cfd9ea;}
.page-hero{padding:150px 0 90px;}
.page-hero h1{font-size:2.4rem;max-width:700px;}
.breadcrumb-custom a{color:#cfd9ea;}
.breadcrumb-custom a:hover{color:#fff;}
.breadcrumb-custom .active{color:var(--gold-2);}

/* Glass tracking card */
.track-card{
  border-radius:var(--radius-lg);border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.96);
  box-shadow:0 30px 60px rgba(3,10,25,.45);
}
.track-card .card-body{padding:30px;}
#track-result{display:none;border-top:1px dashed var(--line);margin-top:16px;padding-top:16px;}
#track-result.show{display:block;}
.track-steps li{font-size:.8rem;color:var(--muted);}
.track-steps li.done{color:var(--navy);font-weight:600;}
.track-steps li.done .dot{background:var(--teal);}
.track-steps .dot{width:10px;height:10px;border-radius:50%;background:var(--line);display:block;margin:0 auto 6px;}

/* Stats */
.stats-strip{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.stats-strip .num{font-family:'Poppins',sans-serif;font-weight:700;font-size:2.2rem;color:var(--navy);}
.stats-strip .lbl{color:var(--muted);font-size:.9rem;}

/* Service cards */
.service-card{
  border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;
  padding:34px 28px;height:100%;transition:transform .18s ease, box-shadow .18s ease;
}
.service-card:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(11,37,69,.1);}
.service-icon{
  width:56px;height:56px;border-radius:14px;
  background:linear-gradient(135deg,rgba(20,184,166,.14),rgba(20,184,166,.05));color:var(--teal-dark);
  display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:20px;
}

/* Timeline / process */
.timeline-modern{position:relative;padding-left:32px;border-left:2px dashed rgba(255,255,255,.2);}
.timeline-modern .t-item{position:relative;padding-bottom:40px;}
.timeline-modern .t-item:last-child{padding-bottom:0;}
.timeline-modern .t-dot{
  position:absolute;left:-41px;top:0;width:20px;height:20px;border-radius:50%;
  background:var(--gold);border:4px solid var(--navy);
}

/* Why choose */
.why-item i{color:var(--gold-2);font-size:1.4rem;}

/* Business / store integration */
.biz-panel{
  background:linear-gradient(120deg,var(--teal) 0%, var(--teal-dark) 100%);
  color:#fff;border-radius:var(--radius-lg);padding:52px;
}
.biz-panel h2{color:#fff;}
.biz-panel p{color:rgba(255,255,255,.88);}
.platform-pill{
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);
  border-radius:12px;padding:14px 16px;color:#fff;font-weight:500;display:flex;align-items:center;gap:10px;
}

/* Forms */
.form-control, .form-select{border-color:var(--line);padding:.7rem .95rem;border-radius:10px;}
.form-control:focus, .form-select:focus{border-color:var(--teal);box-shadow:0 0 0 .2rem rgba(20,184,166,.15);}
.invalid-feedback{font-size:.8rem;}
.form-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:36px;box-shadow:0 20px 50px rgba(11,18,32,.06);}

/* Testimonials */
.quote-card{border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;padding:28px;height:100%;}
.quote-card .who{color:var(--navy);font-weight:600;font-size:.9rem;}

/* FAQ accordion tweaks */
.accordion-item{border:1px solid var(--line);border-radius:12px !important;margin-bottom:12px;overflow:hidden;}
.accordion-button{font-weight:600;color:var(--navy);}
.accordion-button:not(.collapsed){background:rgba(20,184,166,.07);color:var(--teal-dark);box-shadow:none;}
.accordion-button:focus{box-shadow:none;}

/* Team / values cards */
.value-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-md);padding:30px;text-align:center;height:100%;}
.value-card .v-icon{
  width:60px;height:60px;border-radius:16px;margin:0 auto 16px;
  background:linear-gradient(135deg,var(--navy),var(--navy-3));color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:1.6rem;
}

/* Footer */
footer{background:var(--navy);color:#c9d4e6;}
footer h5{color:#fff;font-family:'Poppins',sans-serif;font-size:1rem;}
footer a{color:#c9d4e6;}
footer a:hover{color:#fff;}
footer .social-icon{
  width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.25);
  display:inline-flex;align-items:center;justify-content:center;
}
.newsletter .form-control{border-radius:8px 0 0 8px;}
.newsletter .btn{border-radius:0 8px 8px 0;}

/* Scroll reveal */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease, transform .6s ease;}
.reveal.in-view{opacity:1;transform:translateY(0);}

/* Back to top */
#backToTop{
  position:fixed;right:22px;bottom:22px;width:44px;height:44px;border-radius:50%;
  background:var(--navy);color:#fff;display:none;align-items:center;justify-content:center;
  box-shadow:0 10px 24px rgba(11,18,32,.25);z-index:999;border:none;
}
#backToTop.show{display:flex;}

@media (max-width: 767.98px){
  .hero h1{font-size:2rem;}
  .page-hero h1{font-size:1.9rem;}
  .biz-panel{padding:32px;}
  .form-card{padding:24px;}
}