@keyframes fadeUp { from { opacity:0; transform:translateY(24px);} to { opacity:1; transform:translateY(0);} }
* { box-sizing:border-box; margin:0; padding:0; }
body { font-family:'Plus Jakarta Sans',sans-serif; -webkit-font-smoothing:antialiased; background:#fff; color:#0E1B2A; overflow-x:hidden; }
a { color:#1878C4; text-decoration:none; }
a:hover { color:#0F5C99; }
img { max-width:100%; display:block; }

/* NAV */
.nav { position:fixed; top:0; left:0; right:0; z-index:50; background:transparent; box-shadow:none; transition:background 0.35s ease, box-shadow 0.35s ease; }
.nav.scrolled { background:#ffffff; box-shadow:0 4px 24px rgba(10,42,67,0.08); }
.nav-inner { max-width:1280px; margin:0 auto; padding:0 32px; height:92px; display:flex; align-items:center; justify-content:space-between; }
.logo { height:52px; width:auto; object-fit:contain; }
.nav-links { display:flex; align-items:center; gap:32px; }
.nav-links a { color:#ffffff; font-weight:600; font-size:15px; }
.nav.scrolled .nav-links a { color:#0A2A43; }
.nav-links a.btn-primary { color:#fff; }
.hamburger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px; }
.hamburger span { width:22px; height:2px; background:#fff; display:block; }
.nav.scrolled .hamburger span { background:#0A2A43; }
.mobile-panel { display:none; background:#fff; padding:16px 32px 24px; flex-direction:column; gap:16px; border-top:1px solid #EDF1F5; }
.mobile-panel.open { display:flex; }
.mobile-panel a { color:#0E1B2A; font-weight:600; font-size:16px; }

.btn-primary { background:linear-gradient(135deg,#1878C4,#0A2A43); color:#fff; padding:16px 32px; border-radius:8px; font-weight:700; font-size:15px; box-shadow:0 12px 28px rgba(24,120,196,0.3); display:inline-block; border:none; cursor:pointer; }
.nav-links a.btn-primary { padding:12px 24px; font-size:14px; box-shadow:0 8px 20px rgba(24,120,196,0.28); }
.btn-outline { background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.35); color:#fff; padding:16px 32px; border-radius:8px; font-weight:700; font-size:15px; display:inline-block; }

/* HERO */
.hero { position:relative; min-height:92vh; display:flex; align-items:center; overflow:hidden; }
.hero-bg { position:absolute; inset:0; background-image:url(https://images.unsplash.com/photo-1518770660439-4636190af475?q=80&w=1920&auto=format&fit=crop); background-size:cover; background-position:center; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(100deg,rgba(6,20,36,0.92) 0%,rgba(6,20,36,0.78) 45%,rgba(6,20,36,0.55) 100%); }
.hero-content { position:relative; z-index:2; max-width:1280px; margin:0 auto; padding:0 32px; width:100%; }
.hero-badge { display:inline-block; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.22); color:#DCEBFA; padding:8px 18px; border-radius:100px; font-size:13px; font-weight:600; letter-spacing:0.03em; margin-bottom:28px; animation:fadeUp 0.7s ease both; }
.hero h1 { font-size:clamp(40px,5.5vw,68px); line-height:1.05; font-weight:800; color:#fff; margin-bottom:24px; max-width:720px; animation:fadeUp 0.7s ease 0.1s both; }
.hero p { font-size:18px; line-height:1.7; color:rgba(255,255,255,0.78); max-width:600px; margin-bottom:40px; animation:fadeUp 0.7s ease 0.2s both; }
.hero-actions { display:flex; gap:16px; flex-wrap:wrap; animation:fadeUp 0.7s ease 0.3s both; }

/* SECTIONS */
.section { padding:120px 32px; max-width:1280px; margin:0 auto; }
.section-dark { max-width:none; background:linear-gradient(135deg,#0A2A43,#123B5C); }
.section-dark > * { max-width:1280px; margin-left:auto; margin-right:auto; }
.section-head { text-align:center; max-width:640px; margin:0 auto 64px; }
.eyebrow { color:#1878C4; font-weight:700; font-size:14px; letter-spacing:0.08em; text-transform:uppercase; margin-bottom:12px; }
.eyebrow-light { color:#7FB6E8; }
.section h2 { font-size:clamp(28px,3.5vw,42px); font-weight:800; color:#0A2A43; margin-bottom:16px; }
.section h2.text-white,
.text-white { color:#fff; }
.lead { color:#5B6B7A; font-size:17px; line-height:1.6; }
.lead-light { color:rgba(255,255,255,0.7); }

/* PRODUCTS */
.products-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.product-card { background:#fff; border:1px solid #EAF0F5; border-radius:16px; overflow:hidden; transition:transform 0.35s ease, box-shadow 0.35s ease, background 0.35s ease, border-color 0.35s ease; box-shadow:0 2px 10px rgba(10,42,67,0.04); opacity:0; transform:translateY(36px); }
.product-card.reveal { opacity:1; transform:translateY(0); }
.product-card:hover { transform:translateY(-8px); box-shadow:0 24px 48px rgba(10,42,67,0.14); background:#F4F9FE; border-color:#1878C4; }
.product-card .thumb { height:180px; background-size:cover; background-position:center; }
.product-card .body { padding:24px; }
.product-card h3 { font-size:19px; font-weight:700; color:#0A2A43; margin-bottom:8px; }
.product-card p { font-size:14px; color:#5B6B7A; line-height:1.6; margin-bottom:16px; min-height:44px; }
.product-price { font-size:13px; color:#8CA0B3; margin-bottom:16px; }
.product-price strong { color:#0A2A43; }
.product-price .note { font-family:monospace; }
.view-link { display:inline-block; color:#1878C4; font-weight:700; font-size:14px; border-bottom:2px solid #1878C4; padding-bottom:2px; }

/* SERVICES */
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.service-card { background:#fff; border-radius:16px; padding:32px; height:100%; display:flex; flex-direction:column; transition:transform 0.3s ease, box-shadow 0.3s ease; box-shadow:0 12px 30px rgba(0,0,0,0.18); opacity:0; transform:translateY(36px); }
.service-card.reveal { opacity:1; transform:translateY(0); }
.service-card:hover { transform:translateY(-6px); box-shadow:0 24px 48px rgba(0,0,0,0.28); }
.service-icon { width:52px; height:52px; border-radius:12px; background:linear-gradient(135deg,#E7F1FA,#D3E6F5); display:flex; align-items:center; justify-content:center; margin-bottom:20px; }
.service-card h3 { font-size:19px; font-weight:700; color:#0A2A43; margin-bottom:10px; min-height:52px; display:flex; align-items:center; }
.service-card p { font-size:14px; color:#5B6B7A; line-height:1.6; margin-bottom:18px; flex:1; }

/* WHY US */
.why-us-grid { display:grid; grid-template-columns:minmax(260px,0.8fr) minmax(320px,1.2fr); gap:64px; align-items:center; }
.reasons-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:28px; }
.reason { display:flex; gap:16px; align-items:flex-start; }
.reason-dot { width:44px; height:44px; flex-shrink:0; border-radius:50%; background:#0A2A43; display:flex; align-items:center; justify-content:center; }
.reason-dot span { width:16px; height:16px; background:#1878C4; display:block; }
.reason h4 { font-size:16px; font-weight:700; color:#0A2A43; margin-bottom:6px; }
.reason p { font-size:14px; color:#5B6B7A; line-height:1.6; }

/* STATS */
.stats { text-align:center; }
.stats-note { font-family:monospace; font-size:12px; color:rgba(255,255,255,0.45); margin-bottom:40px; letter-spacing:0.03em; }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:32px; max-width:1100px; margin:0 auto; }
.stat-value { font-size:clamp(36px,4vw,52px); font-weight:800; color:#fff; margin-bottom:8px; }
.stat-label { font-size:14px; color:rgba(255,255,255,0.7); font-weight:600; letter-spacing:0.02em; }

/* CONTACT */
.contact-grid { display:flex; flex-wrap:wrap; gap:64px; }
.contact-grid > div { flex:1 1 360px; }
.contact-info { display:flex; flex-direction:column; gap:24px; margin-bottom:32px; }
.label { font-size:13px; font-weight:700; color:#8CA0B3; text-transform:uppercase; letter-spacing:0.04em; margin-bottom:6px; }
.value { font-size:16px; color:#0A2A43; line-height:1.6; }
.value-link { font-size:16px; color:#0A2A43; font-weight:700; }
.value-green { font-size:16px; color:#12A150; font-weight:700; }
.map-wrap { margin-top:32px; height:220px; border-radius:12px; overflow:hidden; }
.contact-form-wrap { background:#F4F8FB; border-radius:20px; padding:40px; }
.contact-form-wrap h3 { font-size:20px; font-weight:700; color:#0A2A43; margin-bottom:24px; }
.contact-form-wrap form { display:flex; flex-direction:column; gap:18px; }
.contact-form-wrap input, .contact-form-wrap textarea { padding:14px 16px; border-radius:8px; border:1px solid #DCE5EE; font-size:15px; font-family:inherit; resize:vertical; }
.contact-form-wrap button { padding:16px; }

/* FOOTER */
.footer { background:#081E32; padding:56px 32px 32px; }
.footer-top { max-width:1280px; margin:0 auto; display:flex; flex-wrap:wrap; gap:40px; justify-content:space-between; align-items:flex-start; padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,0.08); }
.footer-brand { max-width:320px; }
.footer-logo { height:44px; width:auto; object-fit:contain; filter:brightness(0) invert(1); margin-bottom:16px; }
.footer-brand p { color:rgba(255,255,255,0.55); font-size:14px; line-height:1.6; }
.footer-cols { display:flex; gap:64px; flex-wrap:wrap; }
.footer-title { color:#fff; font-weight:700; font-size:14px; margin-bottom:16px; }
.footer-cols a, .footer-cols span { display:block; color:rgba(255,255,255,0.6); font-size:14px; margin-bottom:10px; }
.footer-bottom { max-width:1280px; margin:0 auto; padding-top:24px; color:rgba(255,255,255,0.4); font-size:13px; }

@media (max-width: 900px) {
  .nav-links { display:none; }
  .hamburger { display:flex; }
  .products-grid, .services-grid { grid-template-columns:1fr; }
  .why-us-grid { grid-template-columns:1fr; }
}