:root{
  --bg:#f6f8fa; --card:#ffffff; --muted:#6b7280; --accent:#d97706;
  --nav-bg: #083058; --nav-text: #ffffff; --hero-overlay: rgba(8,32,56,0.6);
}
*{box-sizing:border-box}
body{font-family:Inter, Arial, Helvetica, sans-serif;margin:0;background:var(--bg);color:#111}
.container{max-width:1000px;margin:24px auto;padding:0 16px}
.site-top{background:var(--nav-bg);color:var(--nav-text);padding:8px 0;font-size:14px}
.site-top .container{display:flex;justify-content:space-between;align-items:center}
.site{background:var(--nav-bg);color:var(--nav-text);padding:12px 0}
.site h1{margin:0;font-size:22px}
.site .nav{display:flex;gap:12px}
.site .nav a{color:var(--nav-text);text-decoration:none;padding:6px 8px;border-radius:6px}
.site .nav a:hover{background:rgba(255,255,255,0.06)}
.card{background:var(--card);border-radius:8px;padding:18px;box-shadow:0 1px 3px rgba(16,24,40,0.06);}
table{width:100%;border-collapse:collapse}
th,td{padding:10px;border-bottom:1px solid #eef2f7;text-align:left}
th{background:#fbfdff;color:#0f172a}
.btn{display:inline-block;padding:8px 12px;background:var(--accent);color:#fff;border-radius:6px;text-decoration:none}
.muted{color:var(--muted)}
footer.site{padding:18px 0;text-align:center;color:var(--muted);font-size:13px}
.actions a{margin-right:8px}

/* Hero and marketing styles */
.hero{padding:80px 0;background:linear-gradient(180deg, var(--hero-overlay), rgba(8,32,56,0.4)), url('../images/trackhoe2.webp') center/cover no-repeat;color:#fff}
.hero .lead{color:rgba(255,255,255,0.95);font-size:1.05rem}
.hero .kpis{display:flex;gap:16px;margin-top:18px}
.kpis .kpi{background:rgba(255,255,255,0.06);padding:12px;border-radius:8px;text-align:center;min-width:120px}
.grid-3{display:flex;gap:16px;margin-top:12px}
.grid-3 .card{flex:1;padding:18px;background:#fff}
.services h3{margin-top:0}
.contact-card input, .contact-card textarea{width:100%;padding:8px;margin:6px 0;border:1px solid #e6e9ef;border-radius:6px}

/* Gallery */
.gallery{display:flex;gap:12px;flex-wrap:wrap}
.gallery img{width:calc(50% - 6px);border-radius:6px;object-fit:cover}

/* Testimonials */
.testimonials{display:flex;gap:12px;flex-wrap:wrap}
.testimonial{flex:1;background:#fff;padding:14px;border-radius:8px;box-shadow:0 1px 6px rgba(2,6,23,0.06)}

@media (max-width:800px){
  .grid-3{flex-direction:column}
  .hero{padding:40px}
  .gallery img{width:100%}
}

@media (max-width:800px){
  .grid-3{flex-direction:column}
  .hero{padding:28px}
}

@media (max-width:600px){.container{padding:0 12px}.site h1{font-size:18px}}

/* Admin enhancements */
.admin-top { display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px }
.stats-grid { display:flex;gap:12px;flex-wrap:wrap }
.stat { background:linear-gradient(180deg, #fff, #fbfbfb); border-radius:10px; padding:14px; min-width:160px; box-shadow:0 6px 18px rgba(2,6,23,0.06); }
.stat .num { font-size:22px; font-weight:700; color:var(--nav-bg); }
.stat .label { color:var(--muted); font-size:13px }
.icon { width:18px;height:18px;vertical-align:middle;margin-right:8px;opacity:0.95 }
.admin-actions .btn{margin-right:8px;margin-top:8px}
.admin-search { display:flex;gap:8px;align-items:center;margin:12px 0 }
.admin-search input{flex:1;padding:8px;border-radius:8px;border:1px solid #e6e9ef}
.pagination{display:flex;gap:6px;align-items:center;margin-top:10px}
.pagination button{padding:6px 10px;border-radius:6px;border:1px solid #e6e9ef;background:white}
.chart-card { padding:18px; }

/* Admin page (index-like formatting) */
.admin-wrapper{max-width:1440px;margin:24px auto;padding:3.5rem 2.5rem}
.admin-wrapper h2{font-family: 'Roboto Condensed', sans-serif;font-size:2.4rem;color:var(--nav-bg);margin:0}
.admin-wrapper .muted{color:var(--muted)}
.admin-wrapper .card{border-radius:12px;box-shadow:0 8px 24px rgba(2,6,23,0.06);background:#fff;padding:18px}
.admin-wrapper .stat{padding:18px;border-radius:10px;background:linear-gradient(180deg,#fff,#fbfdff);}
.admin-wrapper .stat .num{font-size:28px;color:var(--nav-bg)}
.admin-wrapper .admin-actions .btn{padding:10px 14px;font-weight:700}
.admin-wrapper table{width:100%;border-collapse:collapse;margin-top:8px}
.admin-wrapper th, .admin-wrapper td{padding:12px;border-bottom:1px solid #eef2f7;text-align:left}
.admin-wrapper thead th{background:#fbfdff;color:#0f172a}
.admin-wrapper .btn{background:var(--accent);color:#0f172a;padding:10px 14px;border-radius:8px}
.admin-wrapper .pagination button{background:#fff;border:1px solid #e6e9ef;padding:6px 10px;border-radius:6px}

@media (max-width:820px){
  .admin-wrapper{padding:2rem}
  .admin-wrapper .stat{flex:1 1 140px}
}