*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --indigo-deep: #0f2044; --indigo: #1e3a6e; --indigo-mid: #2d5098;
  --indigo-soft: #e8eef8; --teal: #0a9a8a; --teal-light: #12b8a6;
  --teal-dim: rgba(10,154,138,0.1); --silver: #8a9ab8; --silver-light: #c8d3e8;
  --silver-dim: #f0f3f9; --white: #ffffff; --off-white: #f7f9fc;
  --text: #1a2742; --text-mid: #3d5278; --text-soft: #6b80a8;
  --border: rgba(30,58,110,0.1); --border-strong: rgba(30,58,110,0.18);
}
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; background: var(--white); color: var(--text); overflow-x: hidden; }

nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 56px; height: 72px;
  background: rgba(255,255,255,0.96); backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border); transition: box-shadow 0.3s ease;
}
nav.scrolled { box-shadow: 0 4px 32px rgba(30,58,110,0.08); }
.nav-logo-img { height: 40px; width: auto; }
.nav-logo { text-decoration: none; }
.nav-links { display: flex; align-items: center; gap: 36px; }
.nav-links a { font-size: 13px; font-weight: 400; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-soft); text-decoration: none; transition: color 0.2s; }
.nav-links a:hover, .nav-links a.active { color: var(--indigo); }
.nav-cta { padding: 10px 24px !important; background: var(--indigo) !important; color: var(--white) !important; border-radius: 3px; font-size: 12px !important; transition: background 0.2s !important; }
.nav-cta:hover { background: var(--indigo-mid) !important; color: var(--white) !important; }

.page-hero {
  min-height: 480px; display: flex; align-items: flex-end;
  position: relative; overflow: hidden; padding: 120px 56px 80px;
}
.page-hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.page-hero-overlay { position: absolute; inset: 0; background: linear-gradient(120deg, rgba(15,32,68,0.92) 0%, rgba(15,32,68,0.75) 100%); }
.page-hero-inner { position: relative; z-index: 1; max-width: 700px; }
.page-hero-inner h1 { font-family: 'Cormorant Garamond', serif; font-size: clamp(44px,6vw,80px); font-weight: 600; color: #fff; line-height: 1.05; margin-bottom: 20px; }
.page-hero-inner h1 em { color: var(--teal-light); font-style: italic; }
.page-hero-inner p { font-size: 17px; color: rgba(255,255,255,0.65); line-height: 1.7; max-width: 520px; }

section { padding: 100px 56px; }
.section-inner { max-width: 1200px; margin: 0 auto; }
.section-label { font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--teal); margin-bottom: 14px; display: block; }
h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(34px,4vw,52px); font-weight: 600; color: var(--indigo-deep); line-height: 1.1; letter-spacing: -0.01em; }
h2 em { color: var(--teal); font-style: italic; }
h3 { font-family: 'Cormorant Garamond', serif; font-size: 22px; font-weight: 600; color: var(--indigo-deep); margin-bottom: 10px; }
.section-intro { font-size: 16px; color: var(--text-soft); line-height: 1.75; max-width: 580px; margin-top: 18px; }
.divider { width: 40px; height: 2px; background: var(--teal); margin: 28px 0; opacity: 0.6; }

.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.img-box { height: 480px; border-radius: 10px; overflow: hidden; }
.cards-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.cards-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }

.value-card { background: var(--white); border: 1px solid var(--border); border-radius: 10px; padding: 32px 28px; transition: box-shadow 0.2s; }
.value-card:hover { box-shadow: 0 6px 32px rgba(30,58,110,0.1); }
.value-icon { width: 44px; height: 44px; border-radius: 8px; background: var(--teal-dim); border: 1px solid rgba(10,154,138,0.2); display: flex; align-items: center; justify-content: center; margin-bottom: 16px; color: var(--teal); }
.value-card h3 { font-size: 17px; font-weight: 500; font-family: 'Inter',sans-serif; color: var(--indigo-deep); margin-bottom: 8px; }
.value-card p { font-size: 14px; color: var(--text-soft); line-height: 1.7; }

.career-card { background: var(--white); border: 1px solid var(--border); border-radius: 10px; padding: 32px 28px; display: flex; flex-direction: column; gap: 12px; }
.career-icon { width: 48px; height: 48px; border-radius: 10px; background: var(--indigo-soft); display: flex; align-items: center; justify-content: center; color: var(--indigo); }
.career-card h3 { font-family: 'Cormorant Garamond',serif; font-size: 22px; font-weight: 600; color: var(--indigo-deep); }
.career-card p { font-size: 14px; color: var(--text-soft); line-height: 1.75; }

.product-row { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.product-row.reverse { direction: rtl; }
.product-row.reverse > * { direction: ltr; }
.product-text {}
.product-img { height: 400px; border-radius: 10px; overflow: hidden; }
.product-card { background: var(--white); border: 1px solid var(--border); border-radius: 10px; padding: 40px 36px; }
.product-card-icon { width: 56px; height: 56px; border-radius: 10px; background: var(--teal-dim); display: flex; align-items: center; justify-content: center; color: var(--teal); margin-bottom: 20px; }

.services-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.service-card { background: var(--white); padding: 40px 32px; transition: background 0.2s; position: relative; overflow: hidden; }
.service-card::after { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--indigo),var(--teal)); transform:scaleX(0); transform-origin:left; transition:transform 0.3s; }
.service-card:hover { background: var(--silver-dim); }
.service-card:hover::after { transform:scaleX(1); }
.service-num { font-family:'Cormorant Garamond',serif; font-size:48px; font-weight:600; color:var(--silver-light); line-height:1; margin-bottom:16px; display:block; }
.service-title { font-size:16px; font-weight:500; color:var(--indigo-deep); margin-bottom:8px; }
.service-text { font-size:13px; color:var(--text-soft); line-height:1.7; }

.stat-row { display: flex; align-items: baseline; gap: 16px; }
.big-stat { font-family: 'Cormorant Garamond',serif; font-size: 48px; font-weight: 600; color: var(--indigo); line-height: 1; }
.stat-desc { font-size: 15px; color: var(--text-soft); }

.cta-band { background: linear-gradient(120deg,var(--indigo-deep) 0%,var(--indigo) 60%,#1a4a5e 100%); padding: 96px 56px; position: relative; overflow: hidden; }
.cta-band-glow { position:absolute; top:-100px; right:-100px; width:500px; height:500px; border-radius:50%; background:radial-gradient(circle,rgba(10,154,138,0.15) 0%,transparent 70%); pointer-events:none; }
.cta-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:48px; flex-wrap:wrap; position:relative; z-index:1; }
.cta-band .section-label { color:var(--teal-light); }
.cta-band h2 { color:var(--white); }
.cta-band h2 em { color:var(--teal-light); }
.cta-band p { color:rgba(255,255,255,0.6); font-size:16px; margin-top:14px; max-width:520px; line-height:1.7; }
.cta-right { display:flex; gap:14px; flex-wrap:wrap; flex-shrink:0; }
.btn-white { display:inline-flex; align-items:center; gap:8px; padding:15px 32px; background:var(--white); color:var(--indigo-deep); font-size:13px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; text-decoration:none; border-radius:3px; transition:background 0.2s; }
.btn-white:hover { background:var(--off-white); }
.btn-outline-white { display:inline-flex; align-items:center; gap:8px; padding:15px 32px; background:transparent; border:1px solid rgba(255,255,255,0.3); color:var(--white); font-size:13px; font-weight:400; letter-spacing:0.06em; text-transform:uppercase; text-decoration:none; border-radius:3px; transition:border-color 0.2s,background 0.2s; }
.btn-outline-white:hover { background:rgba(255,255,255,0.08); border-color:rgba(255,255,255,0.5); }
.btn-teal { display:inline-flex; align-items:center; gap:10px; padding:14px 28px; background:var(--teal); color:var(--white); font-size:13px; font-weight:500; letter-spacing:0.06em; text-transform:uppercase; text-decoration:none; border-radius:3px; transition:background 0.2s; }
.btn-teal:hover { background:var(--teal-light); }

footer { background:var(--indigo-deep); padding:80px 56px 40px; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:56px; max-width:1200px; margin:0 auto; }
.footer-tagline { font-size:14px; color:rgba(255,255,255,0.4); line-height:1.65; margin-bottom:20px; }
.footer-contact { font-size:13px; color:rgba(255,255,255,0.4); line-height:1.8; }
.footer-contact a { color:rgba(255,255,255,0.4); text-decoration:none; transition:color 0.2s; }
.footer-contact a:hover { color:var(--teal-light); }
.footer-col h4 { font-size:10px; letter-spacing:0.16em; text-transform:uppercase; color:var(--teal-light); margin-bottom:18px; }
.footer-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.footer-col ul li a { font-size:13px; color:rgba(255,255,255,0.4); text-decoration:none; transition:color 0.2s; }
.footer-col ul li a:hover { color:var(--white); }
.footer-col ul li { font-size:13px; color:rgba(255,255,255,0.4); }
.footer-bottom { max-width:1200px; margin:48px auto 0; padding-top:28px; border-top:1px solid rgba(255,255,255,0.07); display:flex; align-items:center; justify-content:space-between; }
.footer-bottom p { font-size:12px; color:rgba(255,255,255,0.25); }
.footer-bottom-links { display:flex; gap:24px; }
.footer-bottom-links a { font-size:12px; color:rgba(255,255,255,0.25); text-decoration:none; }
.footer-bottom-links a:hover { color:rgba(255,255,255,0.6); }

@media (max-width:960px) {
  nav { padding:0 24px; } .nav-links { display:none; }
  section { padding:72px 24px; } .page-hero { padding:100px 24px 64px; }
  .two-col { grid-template-columns:1fr; gap:40px; } .img-box { height:280px; }
  .cards-3, .cards-2 { grid-template-columns:1fr; }
  .services-grid { grid-template-columns:1fr; }
  .product-row, .product-row.reverse { grid-template-columns:1fr; direction:ltr; }
  .product-img { height:240px; }
  .cta-band { padding:64px 24px; } .cta-inner { flex-direction:column; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; } footer { padding:60px 24px 32px; }
}