/* Base */
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
	margin: 0;
	font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
	color: #0f172a;
	background: #ffffff;
	line-height: 1.6;
}
a { color: #e11d48; text-decoration: none; }
a:hover { text-decoration: underline; }

/* Layout */
.container { width: min(1100px, 92%); margin: 0 auto; }

.site-header { background: #0b0f19; position: sticky; top: 0; z-index: 20; }
.header-inner { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; }
.logo img { display: block; height: 40px; width: auto; }
.nav a { color: #e5e7eb; margin-left: 20px; font-weight: 600; }
.nav a.active { color: #ffffff; }
.menu-toggle { display: none; background: transparent; border: 0; width: 40px; height: 40px; margin-left: 8px; cursor: pointer; }
.menu-toggle span { display: block; height: 2px; background: #e5e7eb; margin: 7px 6px; border-radius: 2px; }

.hero { background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%); padding: 36px 0; border-bottom: 1px solid #e5e7eb; }
.hero h1 { margin: 0; font-size: 34px; letter-spacing: -0.02em; }

.content { padding: 28px 0 60px; }
.content h2 { margin-top: 28px; margin-bottom: 10px; font-size: 22px; }
.content p { margin: 10px 0; }
.content ul { margin: 8px 0 18px 18px; }
.content li { margin: 6px 0; }

.feature-image { margin: 14px 0 12px; }
.feature-image img { width: 100%; height: auto; border-radius: 10px; border: 1px solid #e5e7eb; box-shadow: 0 4px 20px rgba(15, 23, 42, 0.06); }

.check-list { list-style: disc; padding-left: 20px; }

.contact-list { list-style: none; padding: 0; }
.contact-list li { margin: 6px 0; }

.site-footer { background: #0b0f19; color: #e5e7eb; }
.footer-inner { display: flex; align-items: center; justify-content: space-between; padding: 18px 0; }
.footer-nav a { color: #e5e7eb; margin-left: 16px; }

/* Responsive */
@media (max-width: 640px) {
	.nav { display: none; }
	.menu-toggle { display: inline-block; }
	.hero h1 { font-size: 26px; }
}

/* Mobile Menu Overlay */
.mobile-menu { position: fixed; inset: 0; background: rgba(0,0,0,0.92); color: #e5e7eb; z-index: 999; opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.mobile-open .mobile-menu { opacity: 1; pointer-events: auto; }
.mobile-menu-inner { width: 86%; max-width: 340px; height: 100%; background: #0b0f19; padding: 18px 18px 28px; box-shadow: 4px 0 24px rgba(0,0,0,0.5); transform: translateX(-100%); transition: transform .35s cubic-bezier(.22,.61,.36,1); }
.mobile-open .mobile-menu-inner { transform: translateX(0); }
.mobile-header { display: flex; align-items: center; justify-content: space-between; }
.mobile-header .logo img { height: 36px; width: auto; }
.menu-close { background: transparent; border: 0; color: #e5e7eb; font-size: 28px; line-height: 1; cursor: pointer; width: 40px; height: 40px; }
.mobile-nav { display: flex; flex-direction: column; margin-top: 18px; }
.mobile-nav a { color: #e5e7eb; padding: 10px 2px; font-weight: 600; }
.mobile-nav a.active { color: #ffffff; }
.mobile-footer { font-size: 12px; color: #94a3b8; margin-top: 14px; }
.mobile-menu hr { border: none; border-top: 1px solid #1f2937; margin: 14px 0; }

/* Prevent body scroll when menu open */
.mobile-open { overflow: hidden; }