:root { --ink:#17202a; --blue:#005eb8; --blue-light:#e5f2fb; --paper:#f5f7f9; --white:#fff; --muted:#66717e; --line:#dfe4e8; --orange:#005eb8; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height:1.55; }
a { color:inherit; }
.site-header, main, footer { width:min(100% - 2.5rem, 72rem); margin-inline:auto; }
.site-header { display:flex; align-items:center; justify-content:space-between; min-height:5.5rem; }
.brand { display:inline-flex; align-items:center; gap:.55rem; color:var(--ink); font-weight:800; text-decoration:none; letter-spacing:-.02em; }
.brand-mark { display:block; width:2rem; height:2rem; object-fit:contain; }
.header-link { color:var(--blue); font-weight:750; text-decoration:none; }
.header-link:hover, .footer-links a:hover { text-decoration:underline; }
.hero { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(19rem,.85fr); align-items:center; gap:clamp(2.5rem,8vw,7rem); min-height:calc(100vh - 5.5rem); padding:4rem 0 6rem; }
.eyebrow { margin:0 0 1rem; color:var(--orange); font-size:.78rem; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
h1,h2,p { margin-top:0; }
h1 { max-width:12ch; margin-bottom:1.35rem; font-size:clamp(3rem,7vw,5.6rem); line-height:.98; letter-spacing:-.065em; }
h2 { font-size:clamp(1.8rem,3.5vw,3rem); line-height:1.08; letter-spacing:-.045em; }
.lede { max-width:40rem; color:var(--muted); font-size:clamp(1.05rem,1.9vw,1.25rem); }
.hero-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2rem; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:.55rem; min-height:3rem; border-radius:.6rem; padding:.65rem 1rem; font-weight:800; text-decoration:none; }
.button-primary { background:var(--blue); color:white; }
.button-primary:hover { background:#004b93; }
.button-secondary { border:1px solid var(--line); background:var(--white); color:var(--blue); }
.app-preview { display:grid; gap:.75rem; border:1px solid var(--line); border-radius:1rem; background:var(--paper); padding:1rem; box-shadow:0 1.8rem 4rem rgba(0,62,122,.14); }
.preview-header { display:flex; align-items:center; justify-content:space-between; padding:.15rem .2rem .45rem; font-size:1.15rem; font-weight:700; }
.preview-add { display:grid; width:2.35rem; height:2.35rem; place-items:center; border-radius:50%; background:var(--blue); color:white; }
.preview-add svg { width:1.25rem; height:1.25rem; fill:none; stroke:currentColor; stroke-linecap:round; stroke-width:2.25; }
.shift-card { border:1px solid var(--line); border-radius:.9rem; background:var(--white); padding:1rem; }
.shift-summary { min-height:4.25rem; }.shift-top,.shift-bottom { display:flex; align-items:center; justify-content:space-between; gap:.75rem; }.shift-top strong { font-size:1.05rem; letter-spacing:-.015em; }.shift-bottom { margin-top:.6rem; }.flags { display:flex; flex-wrap:wrap; gap:.4rem; }.flag { max-width:100%; border:1px solid; border-radius:999px; padding:.28rem .55rem; font-size:.74rem; font-weight:800; letter-spacing:.04em; }.overrun { border-color:#9bc3e8; background:#e5f2fb; color:#00508f; }.oow { border-color:#e0b84f; background:#fff3cd; color:#704900; }.ooa { border-color:#e0a19d; background:#fde8e7; color:#8f2823; }.chevron { display:grid; flex:0 0 auto; width:2.75rem; height:2.75rem; place-items:center; border-radius:50%; background:var(--paper); color:var(--muted); }.chevron svg { width:1.3rem; height:1.3rem; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:2; }
.statement { max-width:49rem; padding:6.5rem 0; }.statement p:last-child { max-width:42rem; color:var(--muted); font-size:1.1rem; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }.feature-grid article { min-height:17rem; border-right:1px solid var(--line); padding:2rem clamp(1rem,3vw,2.2rem) 2rem 0; }.feature-grid article + article { padding-left:clamp(1rem,3vw,2.2rem); }.feature-grid article:last-child { border:0; }.feature-number { color:var(--orange); font-weight:850; }.feature-grid h2 { margin:1.4rem 0 .85rem; font-size:1.45rem; letter-spacing:-.035em; }.feature-grid p { color:var(--muted); font-size:.95rem; }
.offline-section { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,7vw,6rem); margin-top:5rem; border:1px solid var(--line); border-radius:1.1rem; background:var(--white); padding:clamp(1.6rem,5vw,4rem); color:var(--ink); }.offline-section h2 { margin-bottom:1rem; }.offline-section > div > p:last-child { color:var(--muted); }.steps { display:grid; gap:1.2rem; margin:0; padding:0; list-style:none; }.steps li { display:flex; gap:1rem; }.steps li > span { display:grid; flex:0 0 auto; width:2rem; height:2rem; place-items:center; border-radius:50%; background:var(--blue-light); color:var(--blue); font-size:.82rem; font-weight:850; }.steps strong,.steps p { display:block; margin:0; }.steps p { margin-top:.18rem; color:var(--muted); font-size:.9rem; }
.cta { max-width:48rem; padding:7rem 0; text-align:center; }.cta h2 { margin-bottom:1.8rem; }
footer { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:1rem; border-top:1px solid var(--line); padding:1.8rem 0 2.5rem; color:var(--muted); font-size:.84rem; }.footer-links { display:flex; gap:1rem; }.footer-links a { color:var(--blue); font-weight:700; text-decoration:none; }footer p { justify-self:end; margin:0; }
@media (max-width: 44rem) { .site-header,main,footer { width:min(100% - 2rem,72rem); }.site-header { min-height:4.8rem; }.hero { grid-template-columns:1fr; min-height:auto; padding:3.5rem 0 4rem; }.record-card { max-width:28rem; }.statement { padding:4.5rem 0; }.feature-grid { grid-template-columns:1fr; }.feature-grid article,.feature-grid article + article { min-height:auto; border-right:0; border-bottom:1px solid var(--line); padding:1.75rem 0; }.feature-grid article:last-child { border-bottom:0; }.offline-section { grid-template-columns:1fr; margin-top:3rem; }.cta { padding:5rem 0; text-align:left; }footer { grid-template-columns:1fr; padding-bottom:2rem; }footer p { justify-self:start; }.footer-links { order:3; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }