html, body {
  height: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial; background: #111111; color: #eeeeee; line-height: 1.6; }

.container { width: 90%; max-width: 1100px; margin: 0 auto; }

.site-header { background: #111111; padding: 24px 0; border-bottom: 1px solid #ff5722; }
.header-content { display: flex; align-items: center; gap: 20px; }

.logo-area { display:flex; align-items:center; gap:12px; }
.logo-icon-box { width: 300px; height: 72px; border-radius: 12px; background: #000000; display:flex; align-items:center; justify-content:center; position: relative; overflow: visible; }
.logo-bg { position: absolute; width: 100%; height: 100%; left:0; top:0; object-fit:cover; border-radius:12px; }
.rotating-icon { width: 42px; height: 42px; animation: spin 20s linear infinite; position: relative; z-index: 2; }
.logo-full { height: 32px; }

@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

main {
  flex: 1;
  padding: 40px 0;
}
.section { padding: 28px 0; }
h2 { color: #ff5722; margin-bottom: 12px; }
p { color: #eeeeee; }
.service-list { list-style: none; display:flex; flex-wrap:wrap; gap:12px; }
.service-list li { background:#1a1a1a; padding:10px 14px; border-radius:8px; border:1px solid #222; color:#eeeeee; }

.contact a { color: #ff7e55; text-decoration: none; }
.contact a:hover { color: #ff5722; text-decoration: underline; }

.legal-links { padding-top: 20px; }
footer { background: #000000; padding: 18px 0; text-align:center; color:#dddddd; font-size:0.9rem; }

@media (max-width:768px) {
  .header-content { flex-direction: column; align-items:center; text-align:center; gap:8px; }
  .logo-full { height: 28px; }
  .service-list { justify-content:center; }
}