
/* Scitech Solar — simple responsive style matching invoice theme */
:root{
  --solar-orange: #f7b733;
  --solar-deep: #0b2a5b;
  --accent: #fc4a1a;
  --card-bg: #ffffff;
  --muted: #666;
  --max-width: 1100px;
}

*{box-sizing:border-box}
body{font-family: "Poppins", Roboto, Arial, sans-serif; margin:0; color:var(--solar-deep); background:#f6f7fb; line-height:1.6}
a{color:var(--solar-deep); text-decoration:none}

.container{max-width:var(--max-width); margin:0 auto; padding:30px 20px}

.hero{background:white; padding:30px 0; border-bottom:1px solid #eee}
.hero-inner{display:flex; align-items:center; gap:20px; max-width:var(--max-width); margin:0 auto; padding:10px}
.logo{max-width:140px; border-radius:8px; background:transparent}
.hero-text h1{margin:0; font-size:28px; letter-spacing:1px}
.tagline{color:var(--accent); font-weight:600; margin-top:6px}
.contact-line{margin:8px 0; color:var(--muted)}

.cta{display:inline-block; margin-top:12px; background:var(--solar-orange); color:#001; padding:10px 16px; border-radius:6px; font-weight:600}

.card{background:var(--card-bg); border-radius:10px; box-shadow:0 6px 18px rgba(18,24,36,0.06); padding:24px; margin-bottom:24px}
h2{margin-top:0; color:var(--solar-deep); border-left:6px solid var(--solar-orange); padding-left:12px; display:inline-block}

.highlights{display:flex; gap:12px; margin-top:12px; padding:0; list-style:none}
.highlights li{background:#fff7e6; padding:8px 12px; border-radius:8px; color:#5a3f00}

.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; margin-top:16px}
.service{min-height:110px}

.gallery-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin-top:12px}
.gallery-grid img{width:100%; height:180px; object-fit:cover; border-radius:8px; box-shadow:0 6px 16px rgba(2,6,23,0.06)}

.bom ul{margin:8px 0 0 18px}
.contact-form label{display:block; margin-bottom:10px}
.contact-form span{display:block; margin-bottom:6px; font-weight:600}
.contact-form input, .contact-form textarea{width:100%; padding:10px; border:1px solid #ddd; border-radius:6px; font-size:15px}

.form-actions{display:flex; gap:12px; margin-top:12px}
.btn{background:var(--solar-orange); padding:10px 14px; border-radius:6px; border:none; cursor:pointer; font-weight:700}
.btn.ghost{background:transparent; border:1px solid #ddd; color:var(--solar-deep); padding:10px 14px}

.office{margin-top:18px; color:var(--muted)}

.site-footer{background:var(--solar-deep); color:#fff; padding:20px 0; margin-top:30px}
.site-footer a{color:#fff; text-decoration:underline}

/* Responsive */
@media (max-width:720px){
  .hero-inner{flex-direction:column; text-align:center}
  .contact-line{font-size:14px}
  .logo{max-width:110px}
}
