@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root { --bg:#f7f9fc; --white:#fff; --ink:#092243; --muted:#607087; --blue:#1476d4; --blue-dark:#06274d; --line:#dce5ef; --soft:#eef5fb; --green:#218c67; --shadow:0 22px 50px -24px rgba(8,34,67,.34); }
* { box-sizing:border-box; border-color:var(--line); }
html { scroll-behavior:smooth; scroll-padding-top:90px; }
body { margin:0; min-width:320px; background:var(--bg); color:var(--ink); font-family:Inter,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; } button { font:inherit; } img { max-width:100%; }
.site-width { width:min(1280px,calc(100% - 80px)); margin-inline:auto; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.94); border-bottom:1px solid var(--line); backdrop-filter:blur(14px); }
.header-inner { height:88px; display:flex; align-items:center; justify-content:space-between; gap:32px; }
.brand img { display:block; width:136px; height:72px; object-fit:contain; }
.desktop-nav { display:flex; align-items:center; gap:36px; margin-left:auto; }
.nav-link { color:var(--muted); font-size:13px; font-weight:600; transition:color .2s ease; }
.nav-link:hover,.nav-link.active { color:var(--blue); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:40px; padding:0 20px; border:1px solid transparent; border-radius:7px; font-size:13px; font-weight:700; transition:background .2s ease, transform .2s ease, box-shadow .2s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--blue); color:#fff; box-shadow:0 7px 18px -8px rgba(20,118,212,.75); border-radius:24px; }
.button-primary:hover { background:var(--ink); }
.button-dark { background:var(--blue-dark); color:#fff; box-shadow:0 8px 18px -8px rgba(6,39,77,.65); }
.button-dark:hover { background:var(--blue); }
.button-quiet { background:transparent; border-color:var(--line); color:var(--ink); }
.button-quiet:hover { background:var(--soft); }
.menu-control { display:none; border:0; background:transparent; padding:8px; cursor:pointer; }
.menu-control span { display:block; width:22px; height:2px; margin:4px; background:var(--ink); transition:transform .2s ease; }
.mobile-nav { display:none; }
.hero { padding:84px 0 104px; }
.hero-grid { display:grid; grid-template-columns:1.04fr 1fr; align-items:center; gap:78px; }
.eyebrow { color:var(--blue); font-size:12px; font-weight:800; letter-spacing:.01em; text-transform:uppercase; }
.hero-label { display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:20px; background:var(--soft); margin-bottom:22px; }
.status-dot { width:5px; height:5px; border-radius:50%; background:var(--blue); }
.hero h1 { margin:0 0 22px; font-size:58px; line-height:1.08; letter-spacing:-.04em; font-weight:800; }
.hero h1 span { color:var(--blue); }
.hero-intro { margin:0 0 12px; font-size:17px; font-weight:700; }
.body-copy { color:var(--muted); font-size:16px; line-height:1.75; }
.hero-copy .body-copy { max-width:530px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:27px; }
.hero-visual { position:relative; }
.hero-image { display:block; width:100%; aspect-ratio:1.08; object-fit:cover; border-radius:16px; box-shadow:var(--shadow); }
.research-note { position:absolute; left:-22px; bottom:-22px; width:220px; padding:19px 21px; background:var(--white); border:1px solid var(--line); border-radius:9px; box-shadow:var(--shadow); }
.research-note strong { display:block; margin-bottom:5px; color:var(--blue); font-size:14px; }
.research-note p { margin:0; color:var(--muted); font-size:12px; line-height:1.55; }
.section { padding:104px 0; }
.surface { background:var(--white); }
.about-grid { display:grid; grid-template-columns:2fr 1fr; gap:76px; align-items:center; }
.section-title { margin:12px 0 21px; font-size:35px; line-height:1.25; letter-spacing:-.025em; }
.about-title { padding-left:14px; border-left:2px solid var(--blue); }
.about-copy { margin:0; color:var(--muted); font-size:16px; line-height:1.8; }
.principles { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:25px; }
.principle { padding:19px 17px; background:var(--bg); border-radius:6px; }
.principle.vision { background:var(--ink); }
.principle h3 { margin:0 0 12px; color:var(--blue); font-size:11px; text-transform:uppercase; }
.principle.vision h3 { color:#55adf5; }
.principle p { margin:0; color:var(--muted); font-size:14px; line-height:1.7; }
.principle.vision p { color:#b9c9dc; }
.about-image { width:100%; height:100%; max-height:430px; object-fit:cover; border-radius:13px; }
.text-link { display:inline-flex; gap:7px; align-items:center; margin-top:22px; color:var(--blue); font-size:13px; font-weight:700; }
.text-link:hover { text-decoration:underline; }
.products-section { background:var(--bg); }
.section-heading { margin-bottom:38px; text-align:center; }
.section-heading .section-title { margin-bottom:7px; }
.products-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.product-card { display:flex; flex-direction:column; padding:32px; background:var(--white); border:1px solid var(--line); border-radius:6px; transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.product-card:hover { border-color:#8cbce7; box-shadow:var(--shadow); transform:translateY(-3px); }
.product-top { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px; }
.product-icon { width:58px; height:58px; object-fit:contain; }
.product-status { padding:6px 9px; color:var(--green); background:#e7f7ef; border-radius:20px; font-size:10px; font-weight:800; text-transform:uppercase; }
.product-status.paused { color:var(--muted); background:#edf0f3; }
.product-category { margin-bottom:8px; color:var(--blue); font-size:11px; text-transform:uppercase; }
.product-card h3 { margin:0 0 10px; font-size:26px; font-weight:500; }
.product-features { display:flex; flex-direction:column; gap:8px; list-style:none; padding:0; margin:18px 0 22px; color:var(--muted); font-size:14px; }
.product-features li { display:flex; gap:8px; align-items:center; }
.product-features span { color:var(--blue); font-weight:800; }
.product-cta { width:100%; margin-top:auto; }
.product-note { margin-top:auto; padding-top:17px; border-top:1px solid var(--line); }
.product-note strong { display:block; margin-bottom:7px; color:var(--muted); font-size:10px; text-transform:uppercase; }
.product-note p { margin:0; color:var(--muted); font-size:12px; line-height:1.7; }
.contact-section { background:var(--white); }
.contact-band { display:grid; grid-template-columns:2fr 3fr; overflow:hidden; border-radius:15px; background:var(--ink); color:#fff; }
.contact-left { padding:50px 38px; background:linear-gradient(135deg,#103863,#0b70d0); }
.contact-band h2 { margin:0 0 15px; font-size:36px; line-height:1.25; font-weight:500; }
.contact-band p { margin:0; color:#c1d2e5; font-size:15px; line-height:1.75; }
.contact-right { display:flex; flex-direction:column; justify-content:center; padding:50px 38px; }
.contact-right .eyebrow { margin-bottom:16px; color:#45aaf5; }
.email-address { font-size:25px; font-weight:700; }
.email-address:hover { color:#54b4fc; }
.contact-right .button { align-self:flex-start; margin-top:20px; }
.site-footer { padding:34px 0; border-top:1px solid var(--line); background:var(--bg); }
.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:25px; }
.footer-brand { display:flex; align-items:center; gap:9px; font-size:10px; font-weight:800; }
.footer-brand img { width:54px; height:36px; object-fit:contain; }
.footer-inner p { margin:0; color:var(--muted); font-size:10px; }
.footer-links { display:flex; gap:19px; }
.appear { animation:appear .65s ease-out both; }
@keyframes appear { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:800px) { .site-width { width:calc(100% - 40px); } .header-inner { height:84px; } .desktop-nav,.header-cta { display:none; } .menu-control { display:block; } .mobile-nav { display:none; padding:10px 0 22px; } .mobile-nav.is-open { display:flex; flex-direction:column; gap:18px; } .mobile-nav .button { align-self:flex-start; } .hero { padding:58px 0 78px; } .hero-grid,.about-grid,.products-grid,.contact-band { grid-template-columns:1fr; gap:35px; } .hero h1 { font-size:48px; } .hero-image { aspect-ratio:1.12; } .research-note { left:12px; bottom:-18px; } .section { padding:76px 0; } .about-image { max-height:390px; } .contact-band { gap:0; } .contact-left,.contact-right { padding:32px 26px; } .footer-inner { flex-direction:column; align-items:flex-start; gap:15px; } }
@media (max-width:430px) { .principles { grid-template-columns:1fr; } .hero h1 { font-size:43px; } .hero-actions .button { padding-inline:15px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .appear { animation:none; } *,*::before,*::after { transition:none!important; } }
